Use Datalist Tag to Specify Pre-defined Text for Input Element
By Stephen Bucaro
Auto Brand
The HTML5 <datalist> element allows the designer to provide a list of suggested
values for a text input box. If the user doesn't like any of the items in the list,
they can still type their own text into the text box. Example code for a datalist is
shown below.
<datalist id="autobrand">
<option value="Fiat-Chrysler">
<option value="Ford Motor Company">
<option value="General Motors">
<option value="Tesla Motors">
<option value="Toyota Motor Company">
</datalist>
<label for="autobrand">Auto Brand <input type="text" list="autobrand" name="autobrand"></label>
Use the list attribute in the <input> element to associate it with the id
of its respective datalist .
Note the datalist is similar to the select list, except the select list does not
allow the user to enter a value not in the list.
More HTML Code: • HTML dfn Tag• • HTML title Tag• HTML Bulleted or Unordered List• Set Form Controls Tab Order With tabindex Attribute• Line Breaks in HTML• The HTML Head Tag• Divide a Table Into Head (thead), Body (tbody), and Footer (tfoot) Sections• HTML5 Spinbox Control• HTML Textarea Basics