How to filter input type=”file” dialog by specific file type with HTML?

Spread the love

Sometimes, we want to filter input type="file" dialog by specific file type with HTML

In this article, we’ll look at how to filter input type="file" dialog by specific file type with HTML.

How to filter input type="file" dialog by specific file type with HTML?

To filter input type="file" dialog by specific file type with HTML, we set the accept attribute.

For instance, we write

<input
  type="file"
  accept=".jpg, .png, .jpeg, .gif, .bmp, .tif, .tiff|image/*"
/>

to set the accept attribute to the file extensions of the files accepted by the file input.

Conclusion

To filter input type="file" dialog by specific file type with HTML, we set the accept attribute.

Leave a Reply

Your email address will not be published. Required fields are marked *