Radio buttons
API DocumentationRadio inputs are used to provide a list of options where only a single option can be selected. Radio buttons are enhanced by the checkboxradio widget.
Basic markup
To create a set of radio buttons, add an input
with a type="radio"
attribute and a corresponding label
. Set the for
attribute of the label
to match the id
of the input
so they are semantically associated.
Horizontal group
To visually integrate multiple radio buttons into a horizontally grouped button set, the framework will automatically remove all margins between buttons and round only the top and bottom corners of the set if there is a data-role="controlgroup"
attribute on the container.
Vertical group
To make a vertical button set, add the data-direction="vertical"
to the fieldset
.
Mini size
For a more compact version that is useful in toolbars and tight spaces, add the data-mini="true"
attribute to the controlgroup to create a mini version.
Theme
To set the theme, add the data-theme
attribute to the controlgroup or each of the individual radio inputs.