Can I apply the required attribute to <select> fields in HTML5?
Solution 1:
Mandatory: Have the first value empty - required works on empty values
Prerequisites: correct html5 DOCTYPE and a named input field
<select name="somename" required>
<option value="">Please select</option>
<option value="one">One</option>
</select>
As per the documentation (the listing and bold is mine)
The required attribute is a boolean attribute.
When specified, the user will be required to select a value before submitting the form.If a select element
- has a required attribute specified,
- does not have a multiple attribute specified,
- and has a display size of 1 (do not have SIZE=2 or more - omit it if not needed);
- and if the value of the first option element in the select element's list of options (if any) is the empty string (i.e. present as
value=""
),- and that option element's parent node is the select element (and not an optgroup element),
then that option is the select element's placeholder label option.
Solution 2:
The <select>
element does support the required
attribute, as per the spec:
- http://dev.w3.org/html5/spec-author-view/the-select-element.html#the-select-element
Which browser doesn’t honour this?
(Of course, you have to validate on the server anyway, as you can’t guarantee that users will have JavaScript enabled.)