HTML Input="file" Accept Attribute File Type (CSV)

user_1558171 0
Viewed 738681

I have a file upload object on my page:

<input type="file" ID="fileSelect" />

with the following excel files on my desktop:

  1. file1.xlsx
  2. file1.xls
  3. 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/

content-type csv file-upload input html
12 Answers

These days you can just use the file extension

<input type="file" ID="fileSelect" accept=".xlsx, .xls, .csv"/>
user_25480100

In addition to the top-answer, CSV files, for example, are reported as text/plain under macOS but as application/vnd.ms-excel under Windows. So I use this:

<input type="file" accept="text/plain, .csv, application/vnd.openxmlformats-officedocument.spreadsheetml.sheet, application/vnd.ms-excel" />
user_109082220

After my test, on 【macOS 10.15.7 Catalina】, the answer of 【Dom / Rikin Patel】 cannot recognize the [.xlsx] file normally.

I personally summarized the practice of most of the existing answers and passed personal tests. Sum up the following answers:

accept=".csv, .xls, .xlsx, text/csv, application/csv,
text/comma-separated-values, application/csv, application/excel,
application/vnd.msexcel, text/anytext, application/vnd. ms-excel,
application/vnd.openxmlformats-officedocument.spreadsheetml.sheet"
user_62642600

You can use the following accept types

<input id="upload_file" accept="image/png,image/jpg,image/jpeg,.doc, .docx,.xls,.xlsx,.pdf,.csv," name="upload_file" type="file"/>

user_56893490

just write the extensions you want to accept comma separated in the action atr in the out

<input type="file" accept=".any, .ext, .you, .want">
user_154380600

Now you can use new html5 input validation attribute pattern=".+\.(xlsx|xls|csv)".

user_16940110
Related