--- title: "Checkboxes Component" slug: "checkboxes-component" tags: ["module-builder", "module-builder-components"] updated: 2026-09-15T17:04:05Z published: 2026-09-15T17:04:05Z canonical: "docs.unqork.io/checkboxes-component" --- > ## Documentation Index > Fetch the complete documentation index at: https://docs.unqork.io/llms.txt > Use this file to discover all available pages before exploring further. # Checkboxes Component The Checkboxes component lets end-users select one or more options from a visible list of checkboxes. Options can be defined manually or loaded from another field. This component also has built-in support for **Select All**, **None of the Above**, and **Other** patterns. > **How to read settings tables** > > The tables below describe each configurable option as it displays in the UnqorkAI platform. Values are formatted as follows: `inline code` — a value to type exactly as shown | **Bold** — a value selected from a drop-down, radio button, tab, or choice chip | **ON**/**OFF** — toggle state | ✓ — checkbox checked | ☐ — checkbox unchecked ## General Settings | Setting | Field | Type | Default | Description | | --- | --- | --- | --- | --- | | Property ID | `key` | Text input | `selectboxesField` | The unique identifier for this component instance. | ## Display Settings ### Field Text | Setting | Field | Type | Default | Description | | --- | --- | --- | --- | --- | | Label Text | `label` | Text input | — | Identifies the component on the canvas and informs end-users what information is requested. | ### Contextual Help | Setting | Field | Type | Default | Description | | --- | --- | --- | --- | --- | | Tooltip | `tooltip` | Text input | — | A brief description that displays when a cursor is positioned over the tooltip icon. | | Helper Text | `description` | Text input | — | A single line of guidance text that always displays below the component. | ### Formatting | Setting | Field | Type | Default | Description | | --- | --- | --- | --- | --- | | Number of Columns | `numberOfColumns` | Choice chip | **1** | Distributes checkboxes evenly across 1–3 columns. Minimum: 1. Maximum: 3. | ### Default State Options | Setting | Field | Type | Default | Description | | --- | --- | --- | --- | --- | | Hide Field | `hidden` | Toggle | OFF | Hides the component from end-users but always displays in the Module Builder. | ## Data Settings ### Data Storage | Setting | Field | Type | Default | Description | | --- | --- | --- | --- | --- | | Store Data in Database | `persistent` | Toggle | ON | When set to **ON**, this setting this setting stores field values to the database when the module saves, end-users navigate between Panel components, or end-users navigate between workflow screens. Set to **OFF** to exclude this field from server-side submissions. | > [!NOTE] > Fields with **Store Data in Database** set to **OFF** are excluded from Plug-In component's API responses and Unqork's built-in tracker. When using a Plug-In component to remote-execute a module, any component whose value must be included in the API response requires **Store Data in Database** set to **ON**. | Promote Data to Top Level | `promoteDataToTopLevel` | Toggle | OFF | Promotes each checkbox value to the top-level data structure instead of nesting them under the component's Property ID. | ### Pre-Configured Checkbox Selections #### Selection to Trigger a Component | Setting | Field | Type | Default | Description | | --- | --- | --- | --- | --- | | Selection to Trigger a Component | `showOther` | Toggle | OFF | Adds a special checkbox that triggers an additional input when selected. | | ↳ Option Label | `otherLabel` | Text input | `Other` | The label for the checkbox. Visible when **ON**. | | ↳ Value to Store in Submission Data | `otherValue` | Text input | `Other` | The stored value when the trigger checkbox is selected. Visible when **ON**. | | ↳ Component to trigger | `dataSource` | Choice chip | **Text Field** | Sets whether the triggered component is a new Text Field or an existing component. Visible when **ON**. | | ↳ Property Name of Text Field | `otherTextboxKey` | Text input | `selectbox-other` | The Property ID of the auto-generated Text Field. Visible when **Text Field** is selected. | | ↳ Placeholder of Text Field | `otherPlaceholder` | Text input | `Other` | Placeholder text for the auto-generated Text Field. Visible when **Text Field** is selected. | | ↳ Property Name of Existing Component | `otherComponentKey` | Property ID | — | The Property ID of the existing component to trigger. Visible when **Choose Existing** is selected. | #### Selection to Uncheck All Options | Setting | Field | Type | Default | Description | | --- | --- | --- | --- | --- | | Selection to Uncheck All Options | `showNone` | Toggle | OFF | Adds a special checkbox that deselects and disables all other checkboxes when selected. | | ↳ Option Label | `noneLabel` | Text input | `None of the above` | The label for the uncheck-all checkbox. Visible when **ON**. | | ↳ Value to Store in Submission Data | `noneValue` | Text input | `None` | The stored value when the uncheck-all checkbox is selected. Visible when **ON**. | #### Selection to Select All Options | Setting | Field | Type | Default | Description | | --- | --- | --- | --- | --- | | Selection to Select All Options | `showSelectAll` | Toggle | OFF | Adds a special checkbox that selects or deselects all other checkboxes. | | ↳ Option Label | `selectAllLabel` | Text input | — | The label for the select-all checkbox. Visible when **ON**. | ### Data Source Type | Setting | Field | Type | Default | Description | | --- | --- | --- | --- | --- | | Data Source Type | `dataSrc` | Choice chip | **Values** | Sets how options are loaded. | > **Values** — Manually define a list of options. > > | Column | Field | Type | Description | > | --- | --- | --- | --- | > | Option Label | `label` | Text input | The display text shown to end-users for each checkbox. | > | Value to Store in Submission Data | `value` | Text input | The value stored in the database when the checkbox is selected. | > **Data Reference Key** — Load options from another module field. > > | Setting | Field | Type | Default | Description | > | --- | --- | --- | --- | --- | > | Data Reference Key | `data.dataReferenceKey` | Property ID | — | The Property ID of a field that returns a JSON array to use as the option source. | > | Label Path | `labelProperty` | Text input | — | The property in each item to use as the display label. | > | Value Property | `valueProperty` | Property ID | — | The property in each item to use as the stored value. | ## Actions Settings ### Triggers | Setting | Field | Type | Default | Description | | --- | --- | --- | --- | --- | | Trigger | `listener` | Property ID | — | Triggers another component when the selection changes. | ## Validation Settings ### User Input | Setting | Field | Type | Default | Description | | --- | --- | --- | --- | --- | | Required | `validate.required` | Toggle | OFF | Requires at least one checkbox to be selected before the module can be submitted. | | Required Error Message | `errors.required` | Text input | `is required` | Displays when the required field has no selection. | | Custom Error Message | `validate.customMessage` | Text input | — | A generic error message displayed when any validation error occurs. | ## Advanced Settings | Setting | Field | Type | Default | Description | | --- | --- | --- | --- | --- | | Custom CSS Class | `customClass` | Text input | — | A CSS class applied to the component for custom styling. | ## Operations Builder This component supports the [Operations Builder](/unqorkai/docs/operations-builder) in Vega modules. When the module or panel runtime is set to **Vega (2.0)**, an **Event Handlers** section displays in the settings panel for configuring event-driven operations. End-users, also known as Express Users, are the individuals accessing an application through Express View. In most cases, end-users are the customers using the product. A Property ID is the unique field ID used by Unqork to track and link components in your module. Label Text conveys what the input component is and what information it displays. Enter the purpose of the corresponding component or field. The Number data type accepts integer or floating point values. The number data type does not use quotes around numerical values. APIs (application programming interfaces) are a set of protocols and definitions developers use to build and integrate application software. APIs act as the connective tissue between products and services. A data structure is the design used for organizing, using, and storing data. Label Text conveys what the input component is and what information it displays. Enter the purpose of the corresponding component or field. Also known as Record Data. Submission data consists of information saved by Unqork components. View submission data by using the angular command, or in Record Collections. A Property ID is the unique field ID used by Unqork to track and link components in your module. JSON (JavaScript Object Notation) is an open standard file and data interchange format. Unqork uses JSON for submission (record) data. An array is a type of object that stores one or more data types. Data types supported in arrays include numbers, strings, and objects. A JavaScript property is a member of an object that associates a key with a value. A JavaScript object is a data structure that stores a collection of properties. Cascading Style Sheets (CSS) is a style sheet language used for presenting how a HTML or XML document looks to end-users. The Vega (v 2.0.0) runtime is the next-generation engine of the UDesigner platform. Vega uses cutting-edge technologies to improve the Creator and end-user experience. The Vega (v 2.0.0) runtime is the next-generation engine of the UDesigner platform. Vega uses cutting-edge technologies to improve the Creator and end-user experience.