File Input field replacement

Question

<input type="file" />

Can I replace the file input field (above) with a simple button:

<button type="submit">Upload</button>

File input doesn't fit nicely into the design, and styling it is a pain so if its possible to use a button instead for file uploading, thats also cross-browser compatible, that'd be awesome!

Thanks!

Answer 1

You can style with CSS and DOM the input type file

See this page

Answer 2

1- You can't call the open dialog using a button, you can just show the dialog using the input file field, or using a flash component.

2- You can work around this by putting input file on a button "using CSS" and set this input file transparent so it will look like the user is clicking on the button but infact he is clicking on the transparent input file.

Sample: http://www.quirksmode.org/dom/inputfile.html