61

Does the select element have the required attribute?

1

5 Answers 5

150

Yes you can use required attribute in HTML5. But remember, first value should be empty.

<select required>
<option value="">Please select</option>
<option value="first">First</option>
</select>

Here you get the more example:

http://dev.w3.org/html5/spec-author-view/the-select-element.html#the-select-element

3
  • 31
    Do not forget value="", otherwise it will not work (chrome 25)
    – Vivien
    Commented May 23, 2013 at 10:01
  • But it wont become red like other empty required fields
    – Aseem
    Commented May 24, 2019 at 7:08
  • Using Chrome v92 and it still doesn't work without setting value="" to Please select item Commented Aug 25, 2021 at 13:53
13

Yes it has a required attribute, you can use it as follows

<select required>
<option value="" disabled selected>Choose</option>
<option value="first Option">First Option</option>
<option value="Second Option">Second Option</option>
</select>

Reference :

HTML Select required Attribute (W3C)

1

You can do this way to make it look better

    <select required>
    <option hidden="" disabled="disabled" selected="selected" value="">Select subject</option>
    <option value="first Option">First Option</option>
    <option value="Second Option">Second Option</option>
    </select>
1
  • Thank you for the hidden attribute! Commented Mar 22, 2020 at 20:40
-2

Yes it does, but currently it is not supported by any version of all major browsers. This includes Safari, Chrome, Firefox, and IE.

1
  • That is not true, see this, for example. This is a very old question which has an accepted answer.
    – MasterAM
    Commented Aug 31, 2013 at 8:26
-3

It is possible but (just Arif said above) it is important (obviously) that you use the first option without value like:

<form action="#" method="post">
  <div>
    <label for="State">State</label> 
    <select required id="State" name="State">
      <option value="">Choose</option>
      <option value="new">New</option>
      <option value="old">Old</option>
    </select>
  </div>
</form>

You can see more info at: http://www.maxdesign.com.au/2012/11/03/select-required/

1
  • 6
    Welcome to StackOverflow. This looks like it just repeats the information given by the accepted answer. Is there anything you can add to provide more information that would make your answer more distinct? Commented Oct 31, 2014 at 16:13

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.