HTML5 validation in an auto generated Symfony2 form <select> field

Question

I have the following code on a required select :

<select required="required">
    <option value="1">01</option>
    <option value="2">02</option>
    ...
    <option value="31">31</option>
</select>

In my (HTML5 / symfony2) app its a required date (day) so the value must be between 1 and 31 and I do not want blank/null values.

Even though the code works, it breaks w3c validation with the following error :

The first child option element of a select element with a required attribute and without a multiple attribute, and whose size is 1, must have either an empty value attribute, or must have no text content.

What is the best approach to the problem

long · Accepted Answer · 2012-07-12 10:56:40Z

8

With require attribute:

<select required="required">
<option value=""></option><!-- added empty value -->
<option value="1">01</option>
<option value="2">02</option>
...
<option value="31">31</option>
</select>

Without – just remove require attribute:

<select>
<option value="1">01</option>
<option value="2">02</option>
...
<option value="31">31</option>
</select>

answered Jul 12, 2012 at 10:56

long

4,4242 gold badges28 silver badges42 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

TJ VanToll Over a year ago

If you don't want to include the blank option another way you can do this is by setting the selectedIndex of the <select> to -1.

long Over a year ago

Right, but I don't know if it pass the w3c validator. It's JS solution and in fact empty option value (mentioned by validator) will still be missing. Needs test.

TJ VanToll Over a year ago

It'll pass the validator, but I agree that the empty <option> is the better solution. I was just throwing it out there that it will work.

Collectives™ on Stack Overflow

HTML5 validation in an auto generated Symfony2 form <select> field

1 Answer 1

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related