Jesus Zamora
Jesus Zamora

Reputation: 839

Block file upload dialog with javascript

I have the following issue.

I have an aspx file upload input that must only show the file dialog if certain text field has a value, otherwise I must simply show an alter saying to fill the field.

I cannot use jquery.

Upvotes: 2

Views: 1258

Answers (1)

travis
travis

Reputation: 8595

The event object has a preventDefault function that you can use to stop the default from continuing. Using this you can attach a click event to your file upload which will fire upon trying to select a file. From there you can check the value of your text input and return/stop the default of the file element.

(function() {
  var __file = document.getElementById('file');
  var __text = document.getElementById('required');

  __file.addEventListener('click', function (e) {
    e = e || window.event;

    if ( __text.value.length === 0 )
    {
      e.preventDefault();
      return alert('Please fill out the textbox!');
    }


  })
})()

Note: Only tested this in Chrome.

Upvotes: 2

Related Questions