<datalist> tag is an HTML element that provides a pre-defined list of options to a form input field. When a user types in the input field, a dropdown list of suggestions is displayed based on the options specified in the
Here is an example of how to use the
<label for=”city”>Choose a city:</label>
<input list=”cities” id=”city” name=”city”>
<option value=”New York”>
<option value=”Los Angeles”>
In the example above, the
<input> field has an
id of “city” and a
name of “city”. The
<datalist> element has an
id of “cities” and contains a list of options for cities. When a user types in the
<input> field, the browser displays a dropdown list of city options from the
<datalist> element. The user can then select one of the options or continue typing their own value.
Sure, here’s some additional information about the
<datalist>element is supported by all modern browsers, including Google Chrome, Mozilla Firefox, Safari, and Microsoft Edge.
<datalist>element can be used with any
<input>element that accepts text input, such as
<input type="email">, and
- The options in the
<datalist>element can be specified using the
<option>element can have a
valueattribute that specifies the value of the option.
- The text displayed in the dropdown list is the value of the
valueattribute of the
<datalist>element based on user input or other factors.
<datalist>element is a useful tool for providing users with a set of pre-defined options to choose from, which can help to ensure that user input is accurate and consistent.