Back to Docs

<datalist>

Description

The <datalist> HTML element contains a set of <option> elements that represent the pre-defined options recommended for other controls. It acts as a native autocomplete menu linked to an <input> element using the list attribute.

Code Snippet

<label for="city-choice">Select City:</label>
<input list="cities" id="city-choice" name="city-choice" />

<datalist id="cities">
    <option value="Bhubaneswar">
    <option value="Brahmapur">
    <option value="Cuttack">
    <option value="Puri">
    <option value="Sambalpur">
</datalist>

Static Live Preview

localhost/datalist-static.html

Interactive Playground

localhost/datalist-interactive.html