<option>, <optgroup>
An item of a `<select>` or `<datalist>`; `<optgroup>` puts items into groups.
Syntax
<optgroup label="Group"><option value="v">Text</option></optgroup>Attributes
| Parameter | Type | Description |
|---|---|---|
| value | text | What is sent to the server. Without it — the item text. |
| selected | — | The item is selected initially. |
| disabled | — | The item cannot be chosen. |
| label | text | On `<optgroup>` — the group name. |
Examples
Items grouped by category:
<select name="drink">
<optgroup label="Coffee">
<option value="espresso">Espresso</option>
<option value="latte" selected>Latte</option>
</optgroup>
<optgroup label="Tea">
<option value="green">Green tea</option>
<option value="black" disabled>Black tea (sold out)</option>
</optgroup>
</select>Notes
The <optgroup> name cannot be selected — it is just a group heading. Groups cannot be nested.
See also
- <select> — A drop-down list of options.
- <datalist> — A list of suggestions for a text field: pick an option or type your own.
Related recipes
In the tutorial
- Select lists and multi-line text — The select dropdown and option, optgroup groups, choosing several options, textarea and datalist suggestions.