How to filter which files can be seen on upload dialog box?

Question

Hi,

In an ASP.NET MVC application which is not to have client side objects like ActiveXes, Flash or Java Applets (JavaScript is OK), is it feasible to imagine it being possible that when an upload file dialog box pops up, it will only show the files I specify?

For example, only files of extension .docx or docx and jpg would be visible and selectable on the open-file-like dialog box for selecting a file to upload..

I have read that there is an issue with browser support for this functionality, although it is something that should work with the right settings?

If I could get some examples and some heads up on this, it would be great.

Would the AjaxControlKit be something that would support this functionality?

Thanks,

Ric

Answer 1

You can't filter what files appear in the file upload dialog. This is browser-dependent and no browsers provide this functionality.

However, once the file has been selected, it's value can be checked using JavaScript. You can handle the submit event of a form element and match the file input's value with a regular expression. Here's some untested sample code:

<script type="text/javascript">
  function check(event)
  {
    if (!document.getElementById('file').value.match(/.*\.jpg/))
    {
      alert('File must have .jpg extension. Please try again.');
      return false;
    }
    return true;
  }
</script>

<form action="page.html" onsubmit="check">
  <input type="file" name="file" id="file"/>
</form>