Checkbox

Checkbox

✅ When to use:

• It is possible to select more than one option.

❌ When not to use:

• Only one choice should be selected from several options. Use: Radio.

Component properties

Eximee Designer property	Attribute name in the Source	Description
Checkbox checked (section Other)	checked	Specifies whether the field should be checked by default (initially set to "false"). Equivalent to the default value for other fields.
Checked value (section Other)	valueYes	The value the checkbox takes when it is checked - by default, if no other value is set, "true" is returned.
Unchecked value (section Other)	valueNo	The value the checkbox takes when it is unchecked - by default, if no other value is set, "false" is returned.
Checkbox setting (section Other)	tickPosition	Availability of the functionality depends on the license and may not be available in all deployments. By default empty (set to DEFAULT), positions the checkbox in the middle of the component in vertical orientation. Set to TOP positions the checkbox at the top of the component in vertical orientation.
Content (section Basic properties)	text	Text displayed with the component. It is possible to reference variables or fields, e.g.: ${sessionVariable1} or ${GesTextField1}
Description (section Other)	description	Availability of the functionality depends on the license and may not be available in all deployments. Defines the business description of the field - the display method depends on the specific implementation of the component.

More information about component properties: Common component properties

Populating the checkbox text with different content

If the text next to the checkbox should depend on a condition and display different (or formatted) content, it can be populated with content from the TextContent component. To do this, you need to connect on the checkbox in the field External data source service TextContentService, in which, as the input parameter component, we provide the artifact containing the text to be displayed. In the output parameters for the attribute text and value we select the output parameter artifact.

The button leading to detailed information can be placed inside the Content (TextContent) by placing the tag <div class="ex-checkbox-more-info-label">\</div>.

Content defined in moreInfoLabel can be defined dynamically (for example, populated from a Text Field or another component placed on the form).

Component state information

Information about the current value of a given component property, which can then be used on the form, e.g. to populate another field with the value of that property, can be obtained using the construct COMPONENT_ID$PROPERTY_NAME

For a checkbox, the following properties can be retrieved:

Key	Description
moreInfoButtonClicked	true - if the link leading to detailed information has been clicked at least once

Example: populating the property Data source from another field (valueSourceId) via GesCheckbox1$moreInfoButtonClicked returns a true/false value indicating whether the checkbox has been checked.

Available events

Name	Description
CHECK	Event emitted when the checkbox is checked
UNCHECK	Event emitted when the checkbox is unchecked

Available actions

Action documentation: Actions

Name	Description
CHECK	Checking the checkbox. NOTE: does not emit the CHECK event
UNCHECK	Unchecking the checkbox. NOTE: does not emit the UNCHECK event
TOGGLE	Changing the checkbox value to the opposite one. NOTE: does not emit the CHECK and UNCHECK events

Figure 1. Example of the checkbox position set to TOP and default (DEFAULT)

Figure 2. Example appearance of the component on the form.

Figure 3. Example appearance of the component on the form in switch presentation.

Demo forms: demoCheckbox, demoPopup

♿WCAG: Good WCAG practices for low-code dev