input/optgroup

VisualWikitext

@@ Line 1: / Line 1: @@
 {{Csp class properties
-|Subject version=2.1
+|Subject version=2.1,2.5
 |Doc subject=DevOps:Doc/FlexForm
-|Doc synopsis=The <optgroup> HTML element creates a grouping of options within a <select> element.
+|Doc synopsis=The  HTML element creates a grouping of options within a  element.
 |Doc parent=DevOps:Doc/FlexForm/2.0/input/select
 |Doc sort order=10
 |Doc target group=User
 }}

Latest revision as of 10:00, 26 August 2025

Name

optgroup ( as of version 2.3.8 of FlexForm )

Type

select

Synopsis

How to use optroup within a select with option fields to create a grouped dropdown input

Description

The optgroup element is used to create groups of options within a select element.

Example

<label for="dino-select">Choose a dinosaur:</label>
<select id="dino-select">
    <optgroup label="Theropods">
        <option value="Tyrannosaurus">Tyrannosaurus</option>
        <option value="Velociraptor">Velociraptor</option>
        <option value="Deinonychus">Deinonychus</option>
    </optgroup>
    <optgroup label="Sauropods">
        <option value="Diplodocus">Diplodocus</option>
        <option value="Saltasaurus">Saltasaurus</option>
        <option value="Apatosaurus">Apatosaurus</option>
    </optgroup>
</select>

Choose a dinosaur: