[whatwg] The examples of the list attribute of the input element is incorrect

[Futomi Hatano]

Hi all,

I have checked the examples of the list attribute of the input element, which have added today.
http://www.whatwg.org/specs/web-apps/current-work/multipage/common-input-element-attributes.html#the-list-attribute

There is a example which shows how to mark up fallback contents of the datalist element.

<p>
 <label>
  Enter a breed:
  <input type="text" name="breed" list="breeds">
 </label>
 <datalist id="breeds">
  <label>
   or select one from the list:
   <select name="breed">
    <option value=""> (none selected)
    <option>Abyssinian
    <option>Alpaca
    <!-- ... -->
   </select>
  </label>
 </datalist>
</p>

I think that this example is incorrect.
It works in legacy UAs as expected (i.e. the fallback contens are shown.).
But it does not work in UAs which support the datalist element as expected (i.e. the suggests are not shown.),
because the option elements do not have a value attribute.
The spec says that a value attribute is required in the option element for a suggestion.
http://www.whatwg.org/specs/web-apps/current-work/multipage/the-button-element.html#the-datalist-element

The example works in Opera 10.1, because it is based on the old spec.
In fact, the example does not work in Opera 10.5 pre-alpha.
I think that Opera 10.5 pre-alpha is correct.

I think that the example must be as follow.

<p>
 <label>
  Enter a breed:
  <input type="text" name="breed" list="breeds">
 </label>
 <datalist id="breeds">
  <label>
   or select one from the list:
   <select name="breed">
    <option value=""> (none selected)
    <option value="Abyssinian">Abyssinian
    <option value="Alpaca">Alpaca
    <!-- ... -->
   </select>
  </label>
 </datalist>
</p>

This example works in Opera(10.1, 10.5) and other UAs which does not support the datalist element as expected, except Chrome 4.

Thank you.

--
Futomi Hatano
http://www.html5.jp/
http://www.futomi.com/
http://twitter.com/futomi