How to get text value of input type=file for multiple files? Your input selector is using ^=, which matches the exact START of a value, yet your values don't start with that value. I suggest changing that to.= so it searches anywhere within the ID.
I was hoping someone can help me out.
I have a file upload object on my page:
with the following excel files on my desktop:
- file1.xlsx
- file1.xls
- file.csv
I want the file upload to ONLY show
.xlsx
, .xls
, & .csv
files. Using the
accept
attribute, I found these content-types took care of .xlsx
& .xls
extensions… accept
= application/vnd.openxmlformats-officedocument.spreadsheetml.sheet (.XLSX)accept
= application/vnd.ms-excel (.XLS)However, I cannot find the correct content-type for an Excel CSV file! Any suggestions?
EXAMPLE: http://jsfiddle.net/LzLcZ/
Answers:
Well this is embarrassing… I found the solution I was looking for and it couldn’t be simpler. I used the following code to get the desired result. Hope this helps someone in the future. Thanks everyone for your help.
Valid Accept Types:
For CSV files (.csv), use:
For Excel Files 97-2003 (.xls), use:
For Excel Files 2007+ (.xlsx), use:
For Text Files (.txt) use:
For Image Files (.png/.jpg/etc), use:
For HTML Files (.htm,.html), use:
For Video Files (.avi, .mpg, .mpeg, .mp4), use:
For Audio Files (.mp3, .wav, etc), use:
For PDF Files, use:
DEMO:
http://jsfiddle.net/dirtyd77/LzLcZ/144/
http://jsfiddle.net/dirtyd77/LzLcZ/144/
NOTE:
If you are trying to display Excel CSV files (
.csv
), do NOT use:text/csv
application/csv
text/comma-separated-values
(works in Opera only).
If you are trying to display a particular file type (for example, a
WAV
or PDF
), then this will almost always work…Answers:
Dom this attribute is very old and not accepted in modern browsers as far as I know, But here is an alternative to it, Try this
I guess it’ll help you of course you can change this script according to your needs.
Answers:
I have used
text/comma-separated-values
for CSV mime-type in accept attribute and it works fine in Opera. Tried text/csv
without luck.Some others MIME-Types for CSV if the suggested do not work:
- text/comma-separated-values
- text/csv
- application/csv
- application/excel
- application/vnd.ms-excel
- application/vnd.msexcel
- text/anytext
Source: http://filext.com/file-extension/CSV
Answers:
Questions:
You can know the correct content-type for any file by just doing the following:
1) Select interested file,
2) And run in console this:
You can also set attribute “multiple” for your input to check content-type for several files at a time and do next:
Attribute accept has some problems with multiple attribute and doesn’t work correctly in this case.
Answers:
This didn’t work for me under Safari 10:
I had to write this instead:
Answers:
I have modified the solution of @yogi. The addition is that when the file is of incorrect format I reset the input element value.
I have custom verification buildin, because in open file window the user can still choose the options “All files (‘*’)”, regardless if I explicitly set the accept attribute in input element.
Answers:
Now you can use new html5 input validation attribute
pattern='.+.(xlsx|xls|csv)'
.Answers:
Tags: csv, file, html, input