Checkbox
The Checkbox component changes theme of browser-default checkboxes to a form more adapted to the mobile environment.
Note |
---|
This component is supported since Tizen 2.4. |
It was renamed from CheckboxRadio component of Tizen 2.3. |
Table of Contents
Default Selectors
By default, all <input>
elements with the type="checkbox"
or class="ui-checkbox"
are displayed as checkbox.
HTML Examples
To create a checkbox component, please refer following example:
<input type="checkbox" name="checkbox-1" id="checkbox-1"/> <label for="checkbox-1">Apple</label> <input type="checkbox" name="checkbox-2" id="checkbox-2" checked="checked"/> <label for="checkbox-2">Banana</label>
Methods
Summary
Method | Description |
---|---|
disable() |
Disables the component. |
enable() |
Enables the component. |
value() |
Set/Return a value from checkbox element. |
disable
-
Disables the component.
disable()
Return value:
Type Description Checkbox Returns Checkbox. Code example:
<input type="checkbox" name="checkbox-1" id="checkbox-1"/> <label for="checkbox-1">Normal</label> <script> var element = document.getElementById("checkbox-1"), checkboxWidget = tau.widget.Checkbox(element); checkboxWidget.disable(); </script>
enable
-
Enables the component.
enable()
Return value:
Type Description Checkbox Returns Checkbox. Code example:
<input type="checkbox" name="checkbox-1" id="checkbox-1"/> <label for="checkbox-1">Normal</label> <script> var element = document.getElementById("checkbox-1"), checkboxWidget = tau.widget.Checkbox(element); checkboxWidget.enable(); </script>
value
-
Set/Return a value from checkbox element.
{string | number} value()
Return value:
Type Description String | number When method do not have value parameter, it returns value of element. Code example:
<input type="checkbox" name="checkbox-1" id="checkbox-1"/> <label for="checkbox-1">Normal</label> <script> var element = document.getElementById("checkbox-1"), checkboxWidget = tau.widget.Checkbox(element); /* Set value to checkbox element */ checkboxWidget.value("checkbox-value"); /* Return checked checkbox element */ console.log(checkboxWidget.value()); </script>