diff --git a/content/en/docs/marketplace/platform-supported-content/widgets/checkbox-radio-selector.md b/content/en/docs/marketplace/platform-supported-content/widgets/checkbox-radio-selector.md new file mode 100644 index 00000000000..086100fb4f0 --- /dev/null +++ b/content/en/docs/marketplace/platform-supported-content/widgets/checkbox-radio-selector.md @@ -0,0 +1,120 @@ +--- +title: "Check box / radio selector" +url: /appstore/widgets/checkbox-radio-selector/ +description: "Describes the configuration and usage of the check box radio selector widget, which is available in the Mendix Marketplace." +#If moving or renaming this doc file, implement a temporary redirect and let the respective team know they should update the URL in the product. See Mapping to Products for more details. +--- + +## Introduction + +The [Checkbox radio selector](https://marketplace.mendix.com/link/component/245825) widget displays a list of options that users can select from. This is useful in scenarios where end-users need to select their data through choices, such as being able to select or de-select different enumeration list. +The widget will automatically display a check box list for multi selection and radio button list for single selection with exception for boolean datasource, where user can choose the render type. + +### Features + +* Supports different data sources: + * Context: + * Association + * Enumeration + * Boolean + * Database lists + * Static values +* Supports custom content rendering +* Supports custom footers + +{{% alert color="info" %}} +This widget does not have lazy loading and pagination feature. If user need to display a lot of options, it is recommended to use [combobox](/appstore/widgets/combobox/) instead +{{% /alert %}} + +## Properties Pane + +The properties pane is divided into two major sections by a toggle at the top of the pane: **Properties** and **Styling**. Combo box properties consist of the following sections: + +Properties: + +* [General](#general) +* [Events](#events) +* [Accessibility](#accessibility) +* [Common](#common) + +Styling: + +* [Design Properties](#design-properties) +* [Common](#common-styling) + +The following sections will describe the different available widget properties and how to configure the widget using them. + +### General Tab {#general} + +#### Data Source Tab + +The **Source** option (required) is used is used to configure the datasource type for the widget. It supports the following data types via these properties: + +* [Context](#context) +* [Database](#database) +* [Static](#static) + +##### Context {#context} + +When Context source is selected, the **Data source** section (required) configures the type of the context. It supports the following data types via these properties: + +* [Association](/refguide/association-source/) +* [Enumeration](/refguide/enumerations/) +* [Boolean](/refguide/boolean-expressions/) + +##### Database List {#database} + +The database source type can be used to set the value of a string or integer attribute with options fetched from an attribute with the same type. + +* **Selection type** – (available in 2.0 and above) determines how other [listen to widget](/refguide/listen-to-grid-source/) data sources perceive the data. This property can only be used with widgets using a [database data source](/refguide/database-source/). + * **Single** – Allows only a single item to be selected from the options list (radio button list). + * **Multi** – Allows multiple items to be selected from the options list (check box list). +* **Caption** – Allows custom captions to be displayed on the options list. +* **Store value** (optional) – Determines where the selected value will be saved into. + +##### Static Values {#static} + +The static source type can be used to set the value of a string attribute with manually configured values. + +#### General Tab + +The **General** section allows you to configure general behavior and captions for the combo box. The following configurations are available: + +* **Empty options text** – captions that will be displayed when there is no data being available. +* **Custom content** – allows custom widgets to be displayed as the label instead of normal text values + +#### Label + +The **Label** section allows you to display labels for the combo box. + +#### Conditional Visibility {#visibility} + +For more information, see [Visibility Section](/refguide/common-widget-properties/#visibility-properties) in *Properties Common in the Page Editor*. + +#### Editability Tab {#editability} + +For more information, see [Editability Section](/refguide/common-widget-properties/#editability) in *Properties Common in the Page Editor*. + +### Events Tab {#events} + +The following configurations are available: + +* **On change** – executes an action when the attribute value changes + +### Accessibility Tab {#accessibility} + +The **Accessibility** tab allows you to configure settings for combo box accessibility features. + +### Common Tab {#common} + +For more information, see [Common Section](/refguide/common-widget-properties/#common-properties) in *Properties Common in the Page Editor*. + +## Styling + +### Design Properties Section {#design-properties} + +{{% snippet file="/static/_includes/refguide/design-section-link.md" %}} + +### Common Section {#common-styling} + +{{% snippet file="/static/_includes/refguide/common-section-link.md" %}}