html
  1. html-datalist-tag
PreviousNext

HTML <datalist> Tag

  • The <datalist> tag in HTML is used in conjunction with input elements (like <input type="text">) to provide a list of predefined options for user selection.
  • It's particularly useful for providing suggestions or options as a user types into a text input field.

<label for="browsers">Choose a browser:</label>
<input list="browsers" id="browserChoice" name="browser">
<datalist id="browsers">
    <option value="Chrome">
    <option value="Firefox">
    <option value="Safari">
    <option value="Edge">
    <option value="Opera">
</datalist>
Try Playground
  • The <datalist> contains a list of options within <option> tags.
  • The id attribute in the <input> tag (id="browsers") should match the id attribute in the <datalist> tag (<datalist id="browsers">).
  • This linkage enables the input field to associate with the <datalist>, allowing the suggestions to pop up as the user types.
<data> Tag<dd> Tag
Published on: