<input type="file" accept=".csv" /> Above code allows to uploading of .txt or any type of file also.
How to restrict other file types in html5?
- possible duplicate of File input 'accept' attribute - is it useful?user1864610– user18646102015-03-02 06:54:37 +00:00Commented Mar 2, 2015 at 6:54
- possible duplicate of restrict file upload selection to specific typesFH-Inway– FH-Inway2015-03-02 06:56:00 +00:00Commented Mar 2, 2015 at 6:56
Add a comment |
3 Answers
You can't restrict other file types in html5 file input, if user select other files it allow to select. Attribute 'accept' just give hint to user about supported file types.
Comments
With the input attribute you can specify any file extension to be uploaded. To add multiple attributes, separate them with a comma as so:
<input type="file" accept=".txt,.jpg"> You can also set a predefined family of extensions to be available for upload. Simply use either audio/*, video/*, or image/* to select those file types respectively. These can also be combined with regular file extensions. E.g.
<input type="file" accept="image/*,.psd"> This lets you upload an image or Photoshop file.
I hope this helps!
3 Comments
Nitul
Still you can upload any type of file.
angussidney
@Nitul Yes, but the selection dialog defaults to those file types. Checking and restricting of the files should be done client side (e.g. JavaScript), not via the HTML tag. This attribute just helps reduce the number of incorrect file types uploaded.
angussidney
And server-side checks are very important as well, because a malicious user can do a custom HTTP request to bypass the client-side checks
Try this
<input id="fileSelect" type="file" accept=".csv, application/vnd.openxmlformats-officedocument.spreadsheetml.sheet, application/vnd.ms-excel" /> Also Check this with more details http://jsfiddle.net/dirtyd77/LzLcZ/144/
