> For the complete documentation index, see [llms.txt](https://docs.poweredbybackstage.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.poweredbybackstage.com/modules/checkbox.md).

# Checkbox

![Checkbox module containing a group of checkbox buttons arranged by rows](https://2635135911-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F9NyC60xfSabdCmQW0heP%2Fuploads%2FZ6eIlEt8HPnDTzf0IYJ7%2Fcheckbox-module.png?alt=media\&token=f2b37799-1922-428f-aa69-0b5af8be7fc2)

## Overview

The **Checkbox module** can be used to add one or more checkboxes to be used in a form.

## Checkbox Properties <a href="#properties" id="properties"></a>

**Checkbox Group Id** (required)\
*String*\
Sets the ID of the checkbox group, which can be referenced by other elements.

**Is this field required?**\
*Checkbox, default `disabled`*\
If enabled, guests will be required to check off all checkboxes within the module. If a guest attempts to submit the form without checking it off, a default error message will be displayed.

**Custom Required Message**\
*String*\
If Custom Required Message is selected from the "Is this field required?" dropdown, the checkbox will be required, and this field can be used to customize the error message to be displayed if the checkbox for required field is not checked off. Example: *This field must be accepted before proceeding.*

## Checkboxes

**Checkbox Input Label** (required)\
*List of or a singular String(s)*\
Sets the contents (label) for the checkbox. Multiple checkboxes can be added to a Checkbox Module, each with its own Checkbox Input Label. Example: '*I accept the terms and conditions'.*

**Checkbox Group Label**\
*String*\
Sets the label for the checkbox group, displayed above the contents of the checkbox group.

**Checkbox Group Alignment**\
*String,* [*`flex-direction`*](https://developer.mozilla.org/en-US/docs/Web/CSS/flex-direction) *css property*\
The alignment of items within the checkbox group. These values can be used:

* `row`
* `column`
* `row-reverse`
* `column-reverse`

**Size**\
*Dropdown, default `md`*\
Sets the size of the checkbox(es). These values can be used:

* `sm`
* `md`
* `lg`

**Style attribute**\
*String, css style property input*\
Can apply additional CSS to customize the checkbox.

## Nodes <a href="#nodes" id="nodes"></a>

### Broadcasters

#### **Checkbox:on-change**

Broadcast event when a checkbox is clicked.

#### **Parameters**

value - selected and number selected
