If you want to have a predefined list of suggestions for your input field by using just simple HTML then <datalist>
HTML element is for you.
We will create a list of cities that will be offered as a suggestion for our input field. To create a list we will use the HTML element <datalist>
that will have a list of items and id
which will be used as a reference to our list.
<datalist id="listOfCities">
<option value="Bugojno"></option>
<option value="New York"></option>
<option value="London"></option>
<option value="Peking"></option>
</datalist>
Now, we will create an input
field and connect it to our list with list
attribute.
<input type="text" id="city" list="listOfCities" />
Now when we start typing in our input field suggestions will be loaded.
CODEPEN
Top comments (0)