# Checkbox List

A Check box list renders a list of options and allows user to select multiple values. Use the ForEach action to loop through either all or selected values and action them one at a time.

***

{% embed url="<https://www.youtube.com/embed/b46FXxo9oaQ?autoplay=1&rel=0&vq=1080>" %}
Add a Checkbox List
{% endembed %}

***

### Properties

1. **Direction**

   TopToBottom or LeftToRight - How the options should display to the user
2. **Options**

   ![](https://3514041584-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FqxH8JA8xG3I22tiZG5H6%2Fuploads%2Fgit-blob-2f132a2f0db7d340b55f3cf7b360f4631825c3b9%2Flist-options.png?alt=media)

   Specify a list of options to display in the control. It can be generated from a static list or from data. When populating the Options from a [*Connector*](https://docs.stadium.software/connectors) or file, use the Field Mapping Editor found in the Property Grid (seen circled in red below) to assign the *Text* and the *Value* of the items.
3. **Read-Only**

   Set to True if you want the control to display as read-only (value can't be changed) on the page.
4. **Selected Value**

   A comma separated list of values that should be checked on initial load.
5. **Validations**

   Some validations that can be applied to the List
6. **Visible**

   Set to False if you don't want this control to render on the page and be visible to the user.

***

### Assigning data to a Checkbox List

Example:

To display a Checkbox List of checkboxes for values retrieved by a SQL query:

1. Use an appropriate [Event](https://docs.stadium.software/features/events), e.g. *Load* (page) or *Click* (button) to which a [SetValue](https://docs.stadium.software/actions/set-value) action can be added.
2. Add a [SetValue](https://docs.stadium.software/actions/set-value) action that populates the Checkbox List (*options*) for each returned value.

Data:

Checkbox Lists expect a `List` of objects containing a `text` and a `value` property

```json
[
    {"text":"Monday","value":"1"},
    {"text":"Tuesday","value":"2"},
    {"text":"Wednesday","value":"3"},
    {"text":"Thursday","value":"4"},
    {"text":"Friday","value":"5"}
]
```

The [Field Mapping ](https://docs.stadium.software/features/mappings)option in the [SetValue](https://docs.stadium.software/actions/set-value) action allows for the mapping of object properties other than text & value to these properties
