How to add a drop-down menu and text field in one with HTML?

Spread the love

To add a drop-down menu and text field in one with HTML, we use the datalist element.

For instance, we write

<label
  >Choose a browser from this list: <input list="browsers" name="myBrowser"
/></label>
<datalist id="browsers">
  <option value="Chrome"></option>
  <option value="Firefox"></option>
  <option value="Internet Explorer"></option>
  <option value="Opera"></option>
  <option value="Safari"></option>
  <option value="Microsoft Edge"></option>
</datalist>

to add a datalist element with an id attribute that matches the list attribute value of the input to use the datalist element’s option eleemnts as the choices for the input.

Leave a Reply

Your email address will not be published. Required fields are marked *