fileupload control for multiple files, extension check

Question

I have file upload control for uploading multiple files. Like this

 <ajaxToolkit:AsyncFileUpload ClientIDMode="Static" name="aa[]" BackColor="Azure"
         ForeColor="Black" OnClientUploadError="uploadError" OnClientUploadStarted="abc"
         multiple="multiple" OnClientUploadComplete="uploadComplete" runat="server" 
         ID="AsyncFileUpload1" Width="400px" CompleteBackColor="White" 
         UploadingBackColor="#CCFFFF" OnUploadedComplete="AsyncFileUpload1_UploadedComplete" />

I want to allow only jpg png and gif file types to get uploaded.

How can I achieve this in javascript and jquery?

So the real thing is how can I access file names from fileupload control and checking extension?

Answer 1

You can use function OnClientUploadStarted as follows use a function name in this event as follows

OnClientUploadStarted="AssemblyFileUpload_Started"

and write a function as below

function AssemblyFileUpload_Started(sender, args) {
    var filename = args.get_fileName();
    var ext = filename.substring(filename.lastIndexOf(".") + 1);
    if (ext != 'png') {
        throw { 
            name:        "Invalid File Type", 
            level:       "Error", 
            message:     "Invalid File Type (Only .png)",
            htmlMessage: "Invalid File Type (Only .png)" 
        }
        return false;
    }
    return true;
}