Button group

Creates a series of buttons on a single line which are driven by radio buttons.

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.

results matching ""

    No results matching ""