How can I restrict the file type in the file browse menu of an AsyncFileUpload in the ASP.NET AJAX Control Toolkit

Question

I would like to restrict what they see in the file upload dialog, which is set to "All Files" by default. I understand how to validate that they only uploaded a certain file type, that is not the question here. I would just like to know how to default the file type in the file selection dialog.

Is there any way to change this to "PNG only" or "*.png"?

This is using AsyncFileUpload in the ASP.NET AJAX Control Toolkit.

Answer 1

You can use the OnClientUploadStart property on the control to fire a JavaScript function for validation, like this:

<cc1:AsyncFileUpload ID="FileUpload" runat="server" 
  OnClientUploadStarted="checkExtension" />

Then have this script in your page or included:

function checkExtension(sender, args) {
  var ext = args.get_fileName().substring(filename.lastIndexOf(".") + 1);
  if (ext != 'png') {
    args.set_cancel(true);                           //cancel upload
    args.set_errorMessage("File type must be .png"); //set error message
    return false;
  }
  return true;
}

In this case we're just using various bits of the client-side API to get/check the extension, returning false and stopping the upload/setting the error message (optional) if it's invalid.

Answer 2

The current version of the ajax control toolkit don't have this option.

But the good new is that you could get the source code and add a property do handle this.