Checkboxis similar to the Switch component, offering the user to make a "Yes or No" decision, but using a checkbox as the UI element instead of a toggle.
Checkboxcomponent offers the following configuration properties.
Determines the initial state of the checkbox, and the state it will have when the
Whether the checkbox should be disabled. When disabled, the checkbox is greyed out and does not trigger the associated events.
Text displayed next to the checkbox.
Alignment of the label text.
Whether the checkbox is rendered to the left of the label text, or to the right of it.
Whether this checkbox must be active when a surrounding form is submitted. Learn more about form submission
Toggle with label click
When set to
Checkboxoffers three events related to changing its state. All of these events will only fire when the state changes due to UI events (i.e. user clicks), not when the checkbox state is changed programmatically. None of the associated actions will receive any arguments when triggered.
- On change run: This action is triggered every time the checkbox value changes.
- On false run: This action is triggered when the checkbox value changes from
false, i.e. when the user unchecks it.
- On true run: This action is triggered when the checkbox value changes from
true, i.e. when the user checks it.
"On false run" and "On true run" are triggered slightly earlier than "On change". They are however not executed in sequence, i.e. triggering the "On change" action does not wait or depend on the execution of "On false" or "On true". Due to this behavior, their executions might overlap.
Property / Function
Clears the checkbox, i.e. sets its value to
Provides the current boolean value of the "Disabled" property.
Provides the current string value of the "Label" property.
Resets the checkbox state to the initial "Default value", i.e. it is set to the same state that it had after initial app load.
Sets the value of the "Disabled" property to the provided boolean value.
Updates the value of the "Label" property to the provided string value.
Sets the value of the checkbox to the provided boolean value.
Provides the current boolean value of the checkbox state.