Checkbox

Overview

The Checkbox Web control is a visible indicator of the selection state. It can be used in a Checkbox List and will have a Value bound to the selected state of the Checkbox Cell, or it can exist on its own and have a Value defined by its Data Binding.

To be able to align the Checkbox with a line of text, a Container Web Control must be added first. This Container will include a Checkbox and a Label describing the item it corresponds to.

organizing info

Control Properties

Within a Checkbox List

There are no properties when rendered within a Checkbox List. The List and Checkbox Cell give the Checkbox the data associated with its selection.

Outside of a Checkbox List

There is only a Data Binding Property to Selected outside of a list. This property is a Boolean to determine whether the Checkbox should be selected or not.

Control Actions

Within a Checkbox List

The Checkbox Cell performs the actions for the Checkbox in this case. There are no actions on the Checkbox.

Outside of a Checkbox List

Value Changed- gets fired when the selection state of the checkbox is changed. Check out Action Builder to find all the available actions.

Styling and Theming

Checkboxes behave like a Button. This means that Checkboxes have styles for the following states:

  • Default - When first rendered without state
  • Hover - When the user is hovering over the checkbox
  • Focused - when the checkbox or checkbox cell is focused.
  • Pressed - when the checkbox is being pressed.
  • Selected - when the data binding evaluates to true.
  • Disabled - When the cell is disabled.

Examples

Example 1: Checkboxes in List of items to make a selection

Checkboxes can be used in a Checkbox List to display the selection state on a list of items:

organizing info

To enable this, place a Checkbox within a Checkbox Cell Web Control within a Checkbox List Web Control. The Cell and List will maintain the state of the Checkbox.

Example 2: Checkbox to acknowledge reading an agreement

Checkboxes are also commonly used to confirm consent.

organizing info

In this example, the Checkbox operates by itself and exists without a Checkbox List. To be able to align the Checkbox with a line of text, a Container Web Control must be added first. This Container will include the Checkbox and a Label describing the item it corresponds to. An automatically generated variable will hold its value.