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 Textarea Basics• Line Break Basics• Image Map Basics• Adding Space Around an Image• HTML Frames Basics• Checkbox Basics• HTML Image Basics• HTML List Basics• HTML5 Input Type - URL• When to Use the nofollow Attribute value