0


I have designed a uploader using HTML/CSS and Jquery as frontend and backend is in c#. I was wondering that is there any way to disable the dropdown list in this file selector which says "Custom Files" or is there a way so that no other option appears in this list except the extensions I allow?

This is how it looks when a user clicks on select files

Thanks in advance ..

Arnav Dhiman
  • 25
  • 1
  • 4

1 Answers1

1

Use accept attribute for input type file

<input type="file" name="my-image" id="image" accept="image/*" />

For specific extensions, you can use , to separate 

<input type="file" name="my-image" id="image" accept="image/gif, image/jpeg, image/png" />

EDIT

I believe it's completely out of scope from our programming, it is dependent on browser.

I would prefer to check file extension by validating it using programming.

$('#my_file_field').change(function(){
    var ext = $('#my_file_field').val().split('.').pop().toLowerCase();
    if($.inArray(ext, ['gif','png','jpg','jpeg']) == -1) {
        alert('invalid extension!');
    }
}
Mohit Tanwani
  • 6,608
  • 2
  • 14
  • 32
  • I guess OP is already using `accept` attribute because he has `Custom Files` choice in dropdown list file dialog. BUT, i don't see any other way though – A. Wolff Oct 19 '16 at 11:03
  • Thanks for your help. As A. Wolff told I am already using `accept` attribute. My question was that I do not want any other options in that dropdown list. – Arnav Dhiman Oct 19 '16 at 11:08
  • @ArnavDhiman I would suggest to provide the allowed extension in HTML input tag using accept and rest of things you can validate using `change`. – Mohit Tanwani Oct 19 '16 at 11:21