HTML <datalist> Tag (with 'select' for support for old browsers)
<label>
<p>Type a fruit name beginning with "A" or "B":</p>
<input name="myFruit" list="fruit" maxlength="50">
</label>
<datalist id="fruit">
<label>
<p>or select from the list:</p>
<select name="myFruit">
<option value="Acai">
<option value="Apple">
<option value="Apricot">
<option value="Bananas">
<option value="Blueberries">
<option value="Boysenberries">
<option value="Bread fruit">
</select>
</label>
</datalist>
The above example uses a <select>
element to cater for browsers that don't support the <datalist>
element.
The <datalist>
element allows you to provide a list of predefined options that could be used as options on another control. The above example demonstrates this by providing an "autocomplete" feature on an input control.