HTML datalist tag

The HTML <datalist> tag represents a set of option elements that represent predefined options for other controls.

The tag can be used for providing an “autocomplete” feature on form elements. It lets you provide a list of predefined options to the user as they input data.

For example, if a user begins entering text into an input field, a list would drop down with prefilled values that they could choose from. These values are invisible to the user, except those that are relevant to what the user is typing at that moment.

<label>
Who's your favorite cartoon character?
<input name="favCharacter" list="characters" maxlength="50">
<datalist id="characters">
<option value="Homer Simpson">
<option value="Bart">
<option value="Barney Rubble">
<option value="Fred Flinstone">
<option value="Peter Griffin">
</datalist>
</label>

Eg. :