HTML <datalist> Tag

Description

The <datalist> HTML tag is used in conjunction with the <input> element to create a predefined list of options for user input. It provides a convenient way to offer suggestions or autocomplete options to users as they type into an input field. The <datalist> element contains a series of <option> elements, each representing a possible value or suggestion for the input field. When a user interacts with the associated <input> element, a dropdown list of options from the <datalist> is displayed, allowing the user to select one of the predefined values or continue typing. This tag is particularly useful for enhancing the usability and user experience of web forms.

Properties

Permitted Parents: Any element that accepts phrasing content
Content: <option> elements
Start/End Tags: Start tag: required, End tag: required

Example

HTML

Enter an Australian State:<br>

<input list="browsers">

<datalist id="browsers">

  <option value="South Australia">

  <option value="Western Australia">

  <option value="Victoria">

  <option value="New South Wales">

  <option value="Queensland">

  <option value="Tasmania">

</datalist>

Result

Editor