[thelist] Styling <input type="file">

Juha Suni juha.suni at ilmiantajat.fi
Wed Dec 17 09:11:02 CST 2003

Jeff Howden wrote:
>> <><><><><><><><><><><><><><><><><><><><><><><><><><><><><
>> Ideas?
>> <><><><><><><><><><><><><><><><><><><><><><><><><><><><><
> yeah, walk away from this notion of styling a file input.  it can't
> be done and still have a working file upload.

I can confirm this, after spending the whole day trying to do this, and now
just happened to check my email to see that you guys had already discussed
through this before I had the time to ask ;)

It is possible to hide the file input field, use a graphic or text instead
which fires the file input OnClick, and everything is fine until you try to
submit the form. A Javascript error "Access denied" is what you get, and
there is no way around it, nada. This is the case with IE 5.x and above, a
security measure to protect from malicious hidden file uploads.

You can hack around and hide other parts of the file-input element and leave
only the actual "browse" button visible, but there isnt much more styling
you can do.

The only workaround that seems to exist (briefly checked through it today,
but didnt bother going that way myself) is to create a macromedia flash
object which uses the file-input for letting the user select the file, then
reads the filename from the file-input field (it never submits it), and
deals with the file upload by itself. Its a long workaround, and quite a
hack too, so I cant recommend it to anyone.


More information about the thelist mailing list