HTML - <datalist>

The HTML Datalist Element (<datalist>) contains a set of <option> elements that represent the values available for other controls.

Examples

Example1

HTML
<label>Choose a browser from this list:
<input list="browsers" name="myBrowser" /></label>
<datalist id="browsers">
  <option value="Chrome">
  <option value="Firefox">
  <option value="Internet Explorer">
  <option value="Opera">
  <option value="Safari">
  <option value="Microsoft Edge">
</datalist>

Result

Using the result

The <input> attribute name specifies the name of the control, which is submitted with the form data.

This form data is then available in the server in the http request: String myBrowser = request.getParameter("myBrowser");

Description  

The HTML Datalist Element (<datalist>) contains a set of <option> elements that represent the values available for other controls.

Content categories Flow content, phrasing content.
Permitted content Either phrasing content or zero or more <option> elements.
Tag omission None, both the starting and ending tag are mandatory.
Permitted parent elements Any element that accepts phrasing content.
DOM interface HTMLDataListElement

Browser Compatibility  

Feature Chrome Firefox (Gecko) Internet Explorer Opera Safari
Basic support 20 4.0 (2.0) 10 9.5 No support
Feature Android Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile
Basic support 33 4.0 (2.0) No support 10 No support

See Also  

Specifications  

Specification Status Comment
WHATWG HTML Living Standard
The definition of '<datalist>' in that specification.
Living Standard  
HTML5
The definition of '<datalist>' in that specification.
Recommendation  

License

© 2016 Mozilla Contributors
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-us/docs/web/html/element/datalist

Element HTML HTML forms HTML5 Intermediate Reference Web