Skip to main content
Version: 3.4.0


A checkbox form field is an interactive element in a web form that provides users with multiple selectable options. It allows users to choose one or more options from a pre-determined set by simply checking the corresponding checkboxes.

This type of form field can be used to gather information such as interests, preferences, or approvals, and it provides a simple and intuitive way for users to interact with a form.

Configuring the checkbox elementโ€‹

Checkbox settingsโ€‹

The available configuration options for this form element are:



  • Label - the label that appears on the checkbox
  • Helpertext - additional information about the checkbox (can be hidden inside an infopoint)


  • Default Value - the default value of the checkbox
  • Source Type - it can be Static, Enumeration, or Process Data
  • Add option - label - value pairs can be defined here


The following validators can be added to a checkbox: required and custom (more details here).


The checkbox behavior can be defined using JavaScript expressions for hiding or disabling the element. The following properties can be configured for expressions:

  • Hide - JavaScript expression used to hide the checkbox when it returns a truthy value
  • Disabled - JavaScript expression used to disable the checkbox when it returns a truthy value

It's important to make sure that disabled fields have the same expression configured under the path expressions โ†’ hide.

UI actionsโ€‹

UI actions can be added to the checkbox element to define its behavior and interactions.

  • Event - possible value: CHANGE
  • Action Type - select the action type

For more details on how to configure a UI action, click here.

Checkbox stylingโ€‹


The type of the checkbox can be selected by using the styling tab in UI Designer, possible values:

  • clear
  • bordered


You can customize the typography for the following properties:

  • Label
  • Options
  • Helper & errors

For more details on how to upload and manage fonts, check the following section:

ยปFont management

For more valid CSS properties, click here.

A clear checkbox element with three options added, and a column layout will look like as it follows:

Was this page helpful?