<div class="form-group select multiple">
<label for="beleg" class="control-label">Beleg</label>
<div class="field-container">
<select id="beleg" class="form-control" multiple>
<optgroup label="Vlees">
<option value="worst">Worst</option>
<option value="salami">Salami</option>
<option value="geit">Geit</option>
</optgroup>
<optgroup label="Vis">
<option value="zalm">Zalm</option>
<option value="makreel">Makreel</option>
</optgroup>
</select>
<p class="help-block" id="helpTextId_beleg">Deze producten worden allemaal gemaakt in een fabriek waar ook noten worden verwerkt</p>
</div>
</div>
<div class="form-group select{{#if multiple }} multiple{{/if}}">
<label for="{{ id }}" class="control-label">{{ label }}</label>
<div class="field-container">
<select id="{{ id }}" class="form-control"
{{{ifattr 'disabled' disabled }}}
{{{ifattr 'readonly' readonly }}}
{{{ifattr 'multiple' multiple }}}>
{{#each options }}
<optgroup label="{{ optionType }}"{{{ifattr ' disabled' disabled }}}>
{{#each items }}
<option value="{{ value }}"{{{ifattr ' selected' selected }}}>{{ label }}</option>
{{/each}}
</optgroup>
{{/each}}
</select>
{{#if helpText }}
{{> '@help-block' }}
{{/if}}
</div>
</div>
id: beleg
type: select
label: Beleg
multiple: true
helpText: >-
Deze producten worden allemaal gemaakt in een fabriek waar ook noten worden
verwerkt
options:
- optionType: Vlees
items:
- value: worst
label: Worst
- value: salami
label: Salami
- value: geit
label: Geit
- optionType: Vis
items:
- value: zalm
label: Zalm
- value: makreel
label: Makreel
There are no notes for this item.
This element's text is placed on a background image. Ensure the contrast ratio between the text and all covered parts of the image are at least 4.5:1.
<label for="beleg" class="control-label">Beleg</label>
Check that the title element describes the document.
<title>Default
Check that a change of context does not occur when this input field receives focus.
<select id="beleg" class="form-control" multiple="">
<optgroup label="Vlees">
<option value="worst">Worst</option>
<option value="salami">Salami</option>
<option value="geit">Geit</option>
</optgroup>
<optgroup label="Vis">
<option value="zalm">Zalm</option>
<option value="makreel">Makreel</option>
</optgroup>
</select>
If an input error is automatically detected in this form, check that the item(s) in error are identified and the error(s) are described to the user in text.
<form class="form-horizontal">
<div class="form-group select multiple">
<label for="beleg" class="control-label">Beleg</label>
<div class="field-container">
<select id="beleg" class="form-control" multiple="">
<optgroup label="Vlees">
<option value="worst">Worst</option>
<option value="salami">Salami</option>
<option value="geit">Geit</option>
</optgroup>
<optgroup label="Vis">
<option value="zalm">Zalm</option>
<option value="makreel">Makreel</option>
</optgroup>
</select>
<p class="help-block" id="helpTextId_beleg">Deze producten worden allemaal gemaakt in een fabriek waar ook noten worden verwerkt</p>
</div>
</div>
<button type="submit" class="hidden">VALIDATOR_ONLY</button>
</form>
Check that descriptive labels or instructions (including for required fields) are provided for user input in this form.
<form class="form-horizontal">
<div class="form-group select multiple">
<label for="beleg" class="control-label">Beleg</label>
<div class="field-container">
<select id="beleg" class="form-control" multiple="">
<optgroup label="Vlees">
<option value="worst">Worst</option>
<option value="salami">Salami</option>
<option value="geit">Geit</option>
</optgroup>
<optgroup label="Vis">
<option value="zalm">Zalm</option>
<option value="makreel">Makreel</option>
</optgroup>
</select>
<p class="help-block" id="helpTextId_beleg">Deze producten worden allemaal gemaakt in een fabriek waar ook noten worden verwerkt</p>
</div>
</div>
<button type="submit" class="hidden">VALIDATOR_ONLY</button>
</form>
Check that this form provides suggested corrections to errors in user input, unless it would jeopardize the security or purpose of the content.
<form class="form-horizontal">
<div class="form-group select multiple">
<label for="beleg" class="control-label">Beleg</label>
<div class="field-container">
<select id="beleg" class="form-control" multiple="">
<optgroup label="Vlees">
<option value="worst">Worst</option>
<option value="salami">Salami</option>
<option value="geit">Geit</option>
</optgroup>
<optgroup label="Vis">
<option value="zalm">Zalm</option>
<option value="makreel">Makreel</option>
</optgroup>
</select>
<p class="help-block" id="helpTextId_beleg">Deze producten worden allemaal gemaakt in een fabriek waar ook noten worden verwerkt</p>
</div>
</div>
<button type="submit" class="hidden">VALIDATOR_ONLY</button>
</form>
If this form would bind a user to a financial or legal commitment, modify/delete user-controllable data, or submit test responses, ensure that submissions are either reversible, checked for input errors, and/or confirmed by the user.
<form class="form-horizontal">
<div class="form-group select multiple">
<label for="beleg" class="control-label">Beleg</label>
<div class="field-container">
<select id="beleg" class="form-control" multiple="">
<optgroup label="Vlees">
<option value="worst">Worst</option>
<option value="salami">Salami</option>
<option value="geit">Geit</option>
</optgroup>
<optgroup label="Vis">
<option value="zalm">Zalm</option>
<option value="makreel">Makreel</option>
</optgroup>
</select>
<p class="help-block" id="helpTextId_beleg">Deze producten worden allemaal gemaakt in een fabriek waar ook noten worden verwerkt</p>
</div>
</div>
<button type="submit" class="hidden">VALIDATOR_ONLY</button>
</form>