switch
The switch control allows the user to switch an option between two states. Typical usage of this control is seen in user preferences/settings in mobile OS, where a particular setting can be turned on/off by the user by flipping the switch.
Syntax
<div data-juci="switch" data-label="Try Switching me"></div>
<div data-juci="switch" data-label="Switched off initially" data-value="false"></div>
<div data-juci="switch" data-label="Switched off initially" data-bind="ref: false"></div>
<div data-juci="switch" data-label="Data bound" data-bind="ref: switcher"></div>
<div data-juci="switch" data-label="Customized labels and style" data-ontext="YES" data-offtext="NO"
data-onclass="juci_error"
data-offclass="juci_blue">
</div>
Attributes
-
data-offclass {String} ¶A string containing style class to apply during off state of the switch control.
-
data-offtext {String} ¶A string containing text to display as Off label of the switch control.
-
data-ontext {String} ¶A string containing text to display as on label of the switch control.
-
data-onclass {String} ¶A string containing style class to apply during on state of the switch control.
-
data-onvalue {String|Number|Boolean} ¶A string or numerical value of the control when it is on state.
-
data-juci {String} ¶A string with value switch.
-
data-offvalue {String|Number|Boolean} ¶A string or numerical value of the control when it is off state.