The multiple Attribute

The Current State of HTML5 Forms

<input type=file multiple>
<input type=email multiple>
<input type=range min=0 max=10 value="2,4" multiple>

Live Demo




 

 
Firefox
3.6+

Safari
5+

Safari
7+

Chrome
6+

Opera
11+

IE
10+

Android
File
Email
Range

The Low Down

The multiple attribute is relevant to the fileemail and range input types.

  • File input controls can now have the multiple attribute which allows for multiple files to be selected from the operating systems native file picker UI.
  • You can use an array in the name attribute (not required as per the spec) and process each file like:
  • <input type="file" name="uploads[]" multiple>
    foreach ($_FILES['uploads']['name'] as $file) {
      echo '<li>' . $file . '</li>';
    }
  • If the multiple attribute is not supported, the fallback in older browsers is that users can only select one file.
  • email: Can be used on inputs with type email to allow for multiple email addresses in one input. If the Boolean multiple attribute is set, users can enter more than one email address as long as those addresses are separated by a single comma and zero or more spaces. Email addresses must be comma separated. Spaces are optional: they can be included for readability, but they are ignored..
  • range: Not yet supported, but added to the spec in April 2014, range input GUI will be able to support 2 sliders once the multiple attribute becomes supported. When the multiple attribute is supported on the range input type, the value will be two float numbers concatenated with a comma. When not supported, if a comma separated value is included, the value won’t be understood, and will therefore be ignored. The value will then default to the midpoint.

Our Cookie Policy and Privacy Policy outline how we use cookies to help optimize service, personalize content, tailor and measure our marketing, and improve your user experience. I agree to use of cookies for these purposes.