midHTML5
What is the 'datalist' element?
Updated Apr 28, 2026
Short answer
It provides an 'autocomplete' feature for input elements.
Deep explanation
It contains a set of <option> elements that represent the recommended options available for an <input>. Unlike a <select> box, the user can still type a custom value that isn't in the list.
Real-world example
A search bar that suggests popular categories while still allowing a full custom search query.
Common mistakes
- Forgetting to link the input's `list` attribute to the datalist's `id`.
Follow-up questions
- How does it differ from a <select>?