Button group
Creates a series of buttons on a single line which are driven by radio buttons.
For common form layout options, check the form styleguide
Example usage
{{
form.button_group({
'label': 'Band',
'id': 'foo',
'items': [
form.radio_simple({
'label': 'AM',
'name': 'bands'
}),
form.radio_simple({
'label': 'FM',
'name': 'bands'
}),
form.radio_simple({
'label': 'MW',
'name': 'bands'
})
]
})
}}
See the Pen c0d4f343c6a72b2c09fefe9c6c902820 by Pulsar (@pulsar) on CodePen.
Options applied to parent wrapper
Option | Type | Description |
---|---|---|
class | string | A space separated list of class names |
error | string | Text to explain an error/validation condition. Also adds error state styling |
guidance | string | Text to be displayed in a popover, adds a (?) icon after the input |
guidance-container | string | Element to bind guidance popover scroll behaviour to (default body ) |
help | string | Additional guidance information to be displayed next to the input |
label | string | Text for the <label> companion element |
required | bool | Visually indicates that the field must be completed |
Options applied to input
Option | Type | Description |
---|---|---|
items | array | An array of items to put in the dropdown list (usually radio_simple) |
Any other options not listed here will be applied to the input.
Error state
{{
form.button_group({
'label': 'Band',
'error': 'Something went wrong',
...
See the Pen fd75dffb739f8bbc716df460c8311964 by Pulsar (@pulsar) on CodePen.