| (6 intermediate revisions by the same user not shown) | |||
| Line 1: | Line 1: | ||
| + | ===Name=== | ||
| + | option | ||
| + | ===Type=== | ||
| + | _input | ||
| + | ===Synopsis=== | ||
| + | How to render an option input field. Mostly used within the input select fields. | ||
| + | ===Description=== | ||
| + | The <option> HTML element is used to define an item contained in a <select>, an <optgroup>, or a <datalist> element. As such, <option> can represent menu items in popups and other lists of items in an HTML document. | ||
| + | ===Parameters=== | ||
| + | _input type="option". All valid HTML5 attributes are supported. | ||
| + | There is one specific FlexForm parameter '''nohtmldecode'''. By default all values of an option input will be html decoded to get rid of special characters. To turn this off just add '''nohtmldecode''' as an argument to the option field. | ||
| + | |||
| + | |||
| + | ===Example=== | ||
| + | Using options with select: | ||
| + | <syntaxhighlight lang="html"> | ||
| + | <_label for="pet-select">Choose a pet:</_label> | ||
| + | <_select name="pets" id="pet-select"> | ||
| + | <_input type="option" value="">--Please choose an option--</_input> | ||
| + | <_input type="option" value="dog">Dog</_input> | ||
| + | <_input type="option" value="cat">Cat</_input> | ||
| + | <_input type="option" value="hamster">Hamster</_input> | ||
| + | <_input type="option" value="parrot">Parrot</_input> | ||
| + | <_input type="option" value="spider">Spider</_input> | ||
| + | <_input type="option" value="goldfish">Goldfish</_input> | ||
| + | </_select> | ||
| + | </syntaxhighlight> | ||
| + | <_label for="pet-select">Choose a pet:</_label> | ||
| + | <_select name="pets" id="pet-select"> | ||
| + | <_input type="option" value="">--Please choose an option--</_input> | ||
| + | <_input type="option" value="dog">Dog</_input> | ||
| + | <_input type="option" value="cat">Cat</_input> | ||
| + | <_input type="option" value="hamster">Hamster</_input> | ||
| + | <_input type="option" value="parrot">Parrot</_input> | ||
| + | <_input type="option" value="spider">Spider</_input> | ||
| + | <_input type="option" value="goldfish">Goldfish</_input> | ||
| + | </_select> | ||
| + | ===Note=== | ||
| + | See also '''input/select''' from the menu on the right | ||
| + | ===Links=== | ||
| + | See https://developer.mozilla.org/en-US/docs/Web/HTML/Element/option for all the details. | ||
| ws-class-props | |||
|---|---|---|---|
| Line 1: | Line 1: | ||
{{Doc properties | {{Doc properties | ||
| + | |Doc subject=DevOps:Doc/FlexForm | ||
|Subject version=1.1 | |Subject version=1.1 | ||
| − | |Doc | + | |Doc parent=DevOps:Doc/FlexForm/1.0/input |
| + | |Doc sort order=110 | ||
| + | |Doc target group=User | ||
| + | |Doc synopsis=How to render an option input field. Mostly used within the input select fields. | ||
}} | }} | ||
Latest revision as of 13:56, 22 September 2022
Name
option
Type
_input
Synopsis
How to render an option input field. Mostly used within the input select fields.
Description
The <option> HTML element is used to define an item contained in a <select>, an <optgroup>, or a <datalist> element. As such, <option> can represent menu items in popups and other lists of items in an HTML document.
Parameters
_input type="option". All valid HTML5 attributes are supported. There is one specific FlexForm parameter nohtmldecode. By default all values of an option input will be html decoded to get rid of special characters. To turn this off just add nohtmldecode as an argument to the option field.
Example
Using options with select:
<_label for="pet-select">Choose a pet:</_label>
<_select name="pets" id="pet-select">
<_input type="option" value="">--Please choose an option--</_input>
<_input type="option" value="dog">Dog</_input>
<_input type="option" value="cat">Cat</_input>
<_input type="option" value="hamster">Hamster</_input>
<_input type="option" value="parrot">Parrot</_input>
<_input type="option" value="spider">Spider</_input>
<_input type="option" value="goldfish">Goldfish</_input>
</_select>
Note
See also input/select from the menu on the right
Links
See https://developer.mozilla.org/en-US/docs/Web/HTML/Element/option for all the details.
