Html-tutorial - How to upload only specified file type, Accept Specific File Type in HTML5 File Upload

How to upload only specified file type

We use the form input field as file. It can be made like the form field will accept only specific file type to be accepted by it.

To Accept CSV files (.csv) only, use:

  <input type="file" accept=".csv" /> 

To Accept Excel Files 2003-2007 (.xls) only, use:

  <input type="file" accept="application/vnd.ms-excel" /> 

To Accept Excel Files 2010 (.xlsx) only, use:

<input type="file" accept="application/vnd.openxmlformats-officedocument.spreadsheetml.sheet" /> 

To Accept Text Files (.txt) only, use:

  <input type="file" accept="text/plain" /> 

To Accept Image Files (.png/.jpg/etc) only, use:

  <input type="file" accept="image/*" /> 

To Accept HTML Files (.htm,.html) only, use:

  <input type="file" accept="text/html" /> 

To Accept Video Files (.avi, .mpg, .mpeg, .mp4) only, use:

  <input type="file" accept="video/*" /> 

To Accept Audio Files (.mp3, .wav, etc) only, use:

 
 <input type="file" accept="audio/*" /> 

To Accept PDF Files only, use:

  <input type="file" accept=".pdf" /> 

To Accept Multiple File Types, use:

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

Specify the "accept" parameter with comma seperated values

To Accept Only Single File Type, use:

  <input type="file" accept=".FILETYPE" /> 

The topic on Html-tutorial - How to upload only specified file type is posted by - Guru

Hope you have enjoyed, Html-tutorial - How to upload only specified file typeThanks for your time