Mohan Mohan - 4 months ago 29
HTML Question

Image format dropdown when using <input type=“file”>?

I'd like to restrict the type of file that can be chosen from the native OS file chooser when the user clicks the Browse button in the element in HTML. I have a feeling it's impossible, but I'd like to know if there is a solution. I'd like to keep solely to HTML and JavaScript; no Flash please.

Currently, i have

<form:input path="image" type="file" accept="image/*" style="display: none;"/>

And it display like below,

enter image description here

But i need to display like what we have in our mspaint.

enter image description here

Tim Tim

You can only do something like this

<form:input path="image" type="file" accept="image/gif, image/jpeg, image/png" style="display: none;"/>

But this won't give you the list you're looking for.

Note that this only provides a hint to the browser as to what file-types to display to the user, but this can be easily circumvented, so you should always validate the uploaded file on the server also.