Line 1: | Line 1: | ||
===Name=== | ===Name=== | ||
− | + | select (dropdown) | |
===Type=== | ===Type=== | ||
_select | _select | ||
Line 7: | Line 7: | ||
How to use select with option fields to create a dropdown input | How to use select with option fields to create a dropdown input | ||
===Description=== | ===Description=== | ||
− | The <code> | + | The <code>select</code> element is used to create a drop-down list. |
The <code>name</code> attribute is needed to reference the form data after the form is submitted (if you omit the <code>name</code> attribute, no data from the drop-down list will be submitted). | The <code>name</code> attribute is needed to reference the form data after the form is submitted (if you omit the <code>name</code> attribute, no data from the drop-down list will be submitted). | ||
Line 13: | Line 13: | ||
The <code>id</code> attribute is needed to associate the drop-down list with a label. | The <code>id</code> attribute is needed to associate the drop-down list with a label. | ||
− | The <code><_input type="option"></_input></code>tags inside the <code><select></code> element define the available options in the drop-down list. | + | The <code><nowiki><_input type="option"></_input></nowiki></code>tags inside the <code><select></code> element define the available options in the drop-down list. |
===Parameters=== | ===Parameters=== | ||
− | <code><_select | + | <code><nowiki><_select><_input type="option"></_input></_select></nowiki></code> |
− | |||
− | |||
All other valid HTML5 attributes are allowed | All other valid HTML5 attributes are allowed |
Revision as of 21:41, 23 March 2022
Name
select (dropdown)
Type
_select
Synopsis
How to use select with option fields to create a dropdown input
Description
The select
element is used to create a drop-down list.
The name
attribute is needed to reference the form data after the form is submitted (if you omit the name
attribute, no data from the drop-down list will be submitted).
The id
attribute is needed to associate the drop-down list with a label.
The <nowiki>Missing value attribute.</nowiki>
tags inside the <select>
element define the available options in the drop-down list.
Parameters
<nowiki></nowiki>
All other valid HTML5 attributes are allowed
Example
<p>Select a car:</p>
<div>
<_select name="car">
<_input type="option" value="volvo">Volvo</_input>
<_input type="option" value="saab">Saab</_input>
</_select>
</div>
<div>
<_select name="car-2" placeholder="Select car">
<_optgroup label="German">
<_input type="option" value="bmw">BMW</_input>
<_input type="option" value="mercedes" disabled="disabled">Mercedes</_input>
<_optgroup>
<_optgroup label="French">
<_input type="option" value="renault">Renault</_input>
<_input type="option" value="peugot">Peugot</_input>
<_optgroup>
</_select>
</div>