<datalist>
The <datalist> element sets recommended values for an <input> element. Browsers may show a dropdown menu of all values or match values as the user types.
Status
Limited availability
MDN documentation
Specifications
- HTML (#the-datalist-element), from HTML Workstream (WHATWG).
Browser support (view on caniuse.com)
- Chrome 69 Released on 2018-09-04
- Chrome Android 69 Released on 2018-09-04
- Edge 12 Released on 2015-07-29
- Firefox 110 Released on 2023-02-14
- Firefox for Android ❌ See bugzil.la/2007533 bugzil.la/1905313
- Safari 12.1 Released on 2019-03-25
- Safari on iOS 12.2 Released on 2019-03-25
Baseline availability blocked since February 2023 by Firefox for Android (40 months)
Surveys
- State of HTML 2025 > usage > html styling issues
- State of HTML 2025 > usage > html interoperability features features only
- State of HTML 2025 > usage > html interoperability features
- State of HTML 2025 > usage > html functionality features features only
- State of HTML 2025 > usage > html functionality features
- State of HTML 2025 > forms > forms pain points limitations 1
- State of HTML 2025 > forms > forms pain points interop issues 1
- State of HTML 2025 > forms > forms pain points features
- State of HTML 2025 > forms > forms pain points
- State of HTML 2025 > forms > forms features
- State of HTML 2025 > features > all features
- State of HTML 2025 > all features > all features
- State of HTML 2024 > usage > html interoperability features
- State of HTML 2024 > usage > html functionality features
- State of HTML 2024 > reading list > reading list
- State of HTML 2024 > forms > forms pain points
- State of HTML 2024 > forms > forms features
- State of HTML 2024 > features > all features
- State of HTML 2023 > usage > html interoperability features
- State of HTML 2023 > usage > html functionality features
- State of HTML 2023 > reading list > reading list
- State of HTML 2023 > forms > forms features
- State of HTML 2023 > features > all features
Usage (according to Chrome Platform Status)
~1.972% of page loads. More data at chromestatus.com.Web Platform Tests (WPT)
View the latest WPT test results for this featureDeveloper votes
Do you need this feature?
Let us know by leaving a 👍 reaction on the feedback issue. Don't forget to also leave a comment explaining your specific use case.
Developer use cases
-
This seems like a useful feature when we have a set of recommendations but also we can't list all possible options as they are either ever-updating or unknown. For example: Listing colleges, companies, majors, minors, etc in a job application portal. For this use case however, it would be better: - If the dropdown appeared more like `<select>`. - The new option that the user creates actually sends some data with `value` automatically filled for `<option>`.
This seems like a useful feature when we have a set of recommendations but also we can't list all possible options as they are either ever-updating or unknown. For example: Listing colleges, companies, majors, minors, etc in a job application portal. For this use case however, it would be better: - If the dropdown appeared more like `<select>`. - The new option that the user creates actually sends some data with `value` automatically filled for `<option>`. [see original comment]
View as JSON | Edit this feature | Report an issue | Web-features entry: source, dist