Skip to content

Latest commit

 

History

History
86 lines (58 loc) · 2.8 KB

CheckBox.rst

File metadata and controls

86 lines (58 loc) · 2.8 KB
Raw

dijit.form.CheckBox

Authors

Becky Gibson, Doug Hays, Bill Keese, Nikolai Onken

Developers

?-

since

V?

dijit.form.CheckBox is nearly the same as an HTML checkbox, but with fancy styling.

Usage

CheckBox widgets in dijit are very intuitive and easy to use. Markup constructs for check boxes resemble the same as HTML but dojo provides more control and styling options than a conventional check box.

Conceptually, native HTML checkboxes have 2 separate values; the first being the boolean checked state, and the second being the text value that is submitted with the containing FORM element if the checked state is true. To resolve this dichotomy, the value of a CheckBox widget is false when unchecked, but the text value when checked. Setting the value to true will check the box (but leave the submittable text string unchanged) while false will uncheck it. Setting the value to a text string will check the box and set the value to be submitted to the indicated text string.

Examples

Programmatic example

Let's create a checkbox programmatically, initially unchecked:

Declarative example

Let's create a checkbox with HTML markup, initially checked:

Accessibility

Keyboard

Action Key
Navigate to a checkbox Tab
Toggle checked state Spacebar

Checkboxes and Radio buttons are implemented using the standard input type=checkbox and type=radio elements respectively. CSS is used to overlay the unique theme over the actual input elements. Thus, the keyboard behavior of checkboxes and radio buttons mimics the behavior in the browser.