Wednesday, July 04, 2012

HTML5 Datalist with Fallback

Hat Tip: http://www.sitepoint.com/chrome-20-whats-new/

Provides a autocomplete option, without enforcing the result from the
option.
Fallback is a select box and a text box.

I imagine the fallback has to have the Select box populate the text box.

<label for="choose">What's your favorite browser?</label>
<datalist id="browser">
<select>
<option value="">Other</option>
<option value="Safari">Apple Safari</option>
<option value="Chrome">Google Chrome</option>
<option value="IE">Microsoft Internet Explorer</option>
<option value="Firefox">Mozilla Firefox</option>
<option value="Opera">Opera</option>
</select>
<label for="choose">or type one:</label>
</datalist>
<input id="choose" type="text" value="" list="browser" />

No comments: