Checkbox
API DocumentationCheckbox inputs are used to provide a list of options where more than one can be selected. Checkbox buttons are enhanced by the Checkboxradio widget.
Basic markup
To create a single checkbox, add an input
with a type="checkbox"
attribute and a corresponding label
. If the input
isn't wrapped in its corresponding label
, be sure to set the for
attribute of the label
to match the id
of the input
so they are semantically associated.
Mini size
For a more compact version that is useful in toolbars and tight spaces, add the ui-mini
class to the element's data-wrapper-class
attribute to create a mini version.
Horizontal group
Checkboxes can be used for grouped button sets where more than one button can be selected at once, such as the bold, italic and underline button group seen in word processors. To visually integrate multiple checkboxes into a 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 fieldset
.
Vertical group
To make a vertical button set, add data-direction="vertical"
to the fieldset
.
Theme
To set the theme, add the data-theme
attribute to the fieldset
or to the individual checkbox inputs.