How to have jQuery filtered file types on selecting files before uploading?

Question

I am using jQuery-File-Upload and I would like to do filter file types on selecting. That means every files with non-accepted extension would be hidden on file explorer widget and user cannot see them. I tried to import value for "acceptFileTypes" but it only validates the file type after selecting, and this is not what I want. Anyone help please?

This is just my sample code. I cannot show the official. Sorry for this one.

$('#fileupload').fileupload('option', {
            url: '//localhost/',
            maxFileSize: 5000000,
            acceptFileTypes: /(\.|\/)(gif|jpe?g|png)$/i,
            process: [
                {
                    action: 'load',
                    fileTypes: /^image\/(gif|jpeg|png)$/,
                    maxFileSize: 20000000 // 20MB
                },
                {
                    action: 'resize',
                    maxWidth: 1440,
                    maxHeight: 900
                },
                {
                    action: 'save'
                }
            ]
        });

Answer 1

Use the accept attribute to filter the file types. Refer my sample code below.

<!--Code to access only for excel files-->
<input type="file" accept=".xls,.xlsx" />