This multi-valued component allows users to select one or more options in a checkbox style format. Set your values within the Data tab of the settings. Apply unique settings such as value shortcuts and min/max value validation.

Unique Settings: Field Examples | Guidance | JSON

Data Source Type: The source to use for the Select Box options:

• Values: Create your own list of static values. The Label is the front-end identifier, while the Value is stored in the Database.
• Data Source URL: Designate a URL that provides option values dynamically. Use the Item Template to format the displayed values.

Example - Populating Select Box with U.S. States:

1. Edit the Select Box settings and click the Data tab.
2. Input the Data Source URL endpoint (e.g., https://cdn.rawgit.com/mshafrir/2646763/raw/states_titlecase.json).
3. Configure the Value Property to match a specific JSON object property (e.g., abbreviation).
4. Set the Item Template to display the option label (e.g., {{ item.name }}).

Example JSON Structure:

[
    {
        "name": "Alabama",
        "abbreviation": "AL"
    },
    {
        "name": "Alaska",
        "abbreviation": "AK"
    }
]

Shortcut: Add a keyboard shortcut for selecting a designated option.

Options Label Position: Determines the position of the option label relative to its checkbox.

Inline Layout: Displays the option values horizontally.

Min/Max Checked Number: Defines the minimum and maximum number of options a user can select.

Min/Max Checked Error Message: The validation message displayed when a user selects fewer or more options than allowed.