Select Required validation not working in form

Dhruv Ishpuniani picture Dhruv Ishpuniani · Aug 8, 2018 · Viewed 7.1k times · Source

The "required" validation is working for form

but is not working for the same form if I move the option with empty value down the list.

<!DOCTYPE html>
<html>
<body>
<form action=''>
<select required>
  <option value="volvo">Volvo</option>
  <option value="saab" >Saab</option>
  <option value="mercedes">Mercedes</option>
  <option value="audi">Audi</option>
  <option value="">None</option>
</select>
<input type="submit">
</form>
</body>
</html>

Why? How exactly does the select element validation work?

Referred to the following: https://www.w3schools.com/tags/att_select_required.asp

Answer

YouneL picture YouneL · Aug 8, 2018

The following is from w3 docs:

The required attribute is a boolean attribute. When specified, the user will be required to select a value before submitting the form.

...

if the value of the first option element in the select element's list of options (if any) is the empty string

...

Which means that the required attribute works only if the value of the first element is empty