Let Wufoo do the hard work. Sign up for a free account and start making forms the easy way.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <input type=file> | |
| <input type=file multiple> | |
| <input type=file accept="image/*"> | |
| <input type=file accept="image/*;capture=camera"> | |
Live Demo
 | | | | | | |
The Low Down
The file input type is used to identify resource(s) in the file structure, upload a file, or create a resource to upload.
- The
fileinput element provides a GUI to select a file, and then represents a list of files that are selected with the option to change resource(s) until form submission. - The
multipleattribute allows more than one resource to be selected. Some browsers will add an “s” to their no file is selected message if this attribute is present. - The
acceptattribute provides a hint of what file types the server is able to accept. Adding capture on some devices will allow the user to capture a video, audio or image files with the devices camcorder, microphone and/or camera. - Of the input types, the
fileinput type varies the most between browser, and is not very stylable. - Messages vary: Firefox and IE both use “browse”, while Safari, Chrome and Opera employ “Choose File”, or “Choose Files” if the
multipleattribute is present. - Firefox, Safari, Chrome and Opera indicate the name of the file next to the button if only one file was selected, with Safari including an icon indicating file type.
- If more than one file was selected in the case of
multiple, “X files” is listed, with X being the number of files selected. - IE shows the file name including the full path to that file. In case of multiple files, it presents all files in a scrollable text input.
