<datalist>

  • Revision slug: HTML/Element/datalist
  • Revision title: datalist
  • Revision id: 21467
  • Created:
  • Creator: Fyrd
  • Is current revision? No
  • Comment Removed "Result" section as it wasn't working; 10 words removed

Revision Content

{{ HTMLVersionHeader("5") }}{{ gecko_minversion_header("2") }}

The HTML Datalist Element (<datalist>) contains a set of {{ HTMLElement("option") }} elements that represent the possible options for the value of other controls.

Usage context

Permitted content Phrasing content or zero or more {{ HTMLElement("option") }} elements
Tag omission None, both the start tag and the end tag are mandatory
Permitted parent elements Any element that accepts phrasing content
Normative document HTML5, section 4.10.10

Attributes

This element has no other attributes than the global attributes, common to all elements.

DOM Interface

This element implements the HTMLDataListElement interface.

Examples

<input list="browsers" />
<datalist id="browsers">
  <option value="Chrome">
  <option value="Firefox">
  <option value="Internet Explorer">
  <option value="Opera">
  <option value="Safari">
</datalist>

See also

  • The {{ HTMLElement("input") }} element, and more specifically its {{ htmlattrxref("list", "input") }} attribute;
  • The {{ HTMLElement("option") }} element.

Revision Source

<p>{{ HTMLVersionHeader("5") }}{{ gecko_minversion_header("2") }}</p>
<p>The <em>HTML Datalist Element</em> (<span style="font-family: Courier New;">&lt;datalist&gt;</span>) contains a set of {{ HTMLElement("option") }} elements that represent the possible options for the value of other controls.</p>
<h3>Usage context</h3>
<table class="standard-table"> <tbody> <tr> <td>Permitted content</td> <td><a href="/en/HTML/Content_categories#phrasing_content" title="en/HTML/Content categories#phrasing content">Phrasing content</a> or zero or more {{ HTMLElement("option") }} elements</td> </tr> <tr> <td>Tag omission</td> <td>None, both the <span title="syntax-start-tag">start tag</span> and the <span title="syntax-end-tag">end tag</span> are mandatory</td> </tr> <tr> <td>Permitted parent elements</td> <td>Any element that accepts <a href="/en/HTML/Content_categories#phrasing_content" title="en/HTML/Content categories#phrasing content">phrasing content</a></td> </tr> <tr> <td>Normative document</td> <td><a class=" external" href="http://www.whatwg.org/specs/web-apps/current-work/multipage/the-button-element.html#the-datalist-element" rel="external nofollow" target="_blank" title="http://www.whatwg.org/specs/web-apps/current-work/multipage/the-button-element.html#the-datalist-element">HTML5, section 4.10.10</a></td> </tr> </tbody>
</table>
<h3>Attributes</h3>
<p>This element has no other attributes than the <a href="/en/HTML/Global_attributes" title="en/HTML/Global attributes">global attributes</a>, common to all elements.</p>
<div id="section_3">
<div id="section_3">
<h3 class="editable">DOM Interface</h3>
<p>This element implements the <code><a href="/en/DOM/HTMLDataListElement" title="en/DOM/HTMLDataListElement">HTMLDataListElement</a></code> interface.</p>
<h3>Examples</h3>
<pre class="brush: html">&lt;input list="browsers" /&gt;
&lt;datalist id="browsers"&gt;
  &lt;option value="Chrome"&gt;
  &lt;option value="Firefox"&gt;
  &lt;option value="Internet Explorer"&gt;
  &lt;option value="Opera"&gt;
  &lt;option value="Safari"&gt;
&lt;/datalist&gt;
</pre>
<h3>See also</h3>
<ul> <li class="last">The {{ HTMLElement("input") }} element, and more specifically its {{ htmlattrxref("list", "input") }} attribute;</li> <li class="last">The {{ HTMLElement("option") }} element.</li>
</ul>
</div>
</div>
Revert to this revision