Skip to content

Commit a92d45f

Browse files
committed
update checkbox radio selector widget
1 parent 198fd59 commit a92d45f

File tree

1 file changed

+120
-0
lines changed

1 file changed

+120
-0
lines changed
Lines changed: 120 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,120 @@
1+
---
2+
title: "Check box / radio selector"
3+
url: /appstore/widgets/checkbox-radio-selector/
4+
description: "Describes the configuration and usage of the check box radio selector widget, which is available in the Mendix Marketplace."
5+
#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.
6+
---
7+
8+
## Introduction
9+
10+
The [Checkbox radio selector](https://marketplace.mendix.com/link/component/000) 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.
11+
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.
12+
13+
### Features
14+
15+
* Supports different data sources:
16+
* Context:
17+
* Association
18+
* Enumeration
19+
* Boolean
20+
* Database lists
21+
* Static values
22+
* Supports custom content rendering
23+
* Supports custom footers
24+
25+
{{% alert color="info" %}}
26+
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
27+
{{% /alert %}}
28+
29+
## Properties Pane
30+
31+
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:
32+
33+
Properties:
34+
35+
* [General](#general)
36+
* [Events](#events)
37+
* [Accessibility](#accessibility)
38+
* [Common](#common)
39+
40+
Styling:
41+
42+
* [Design Properties](#design-properties)
43+
* [Common](#common-styling)
44+
45+
The following sections will describe the different available widget properties and how to configure the widget using them.
46+
47+
### General Tab {#general}
48+
49+
#### Data Source Tab
50+
51+
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:
52+
53+
* [Context](#context)
54+
* [Database](#database)
55+
* [Static](#static)
56+
57+
##### Context {#context}
58+
59+
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:
60+
61+
* [Association](/refguide/association-source/)
62+
* [Enumeration](/refguide/enumerations/)
63+
* [Boolean](/refguide/boolean-expressions/)
64+
65+
##### Database List {#database}
66+
67+
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.
68+
69+
* **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/).
70+
* **Single** – Allows only a single item to be selected from the options list (radio button list).
71+
* **Multi** – Allows multiple items to be selected from the options list (check box list).
72+
* **Caption** – Allows custom captions to be displayed on the options list.
73+
* **Store value** (optional) – Determines where the selected value will be saved into.
74+
75+
##### Static Values {#static}
76+
77+
The static source type can be used to set the value of a string attribute with manually configured values.
78+
79+
#### General Tab
80+
81+
The **General** section allows you to configure general behavior and captions for the combo box. The following configurations are available:
82+
83+
* **Empty options text** – captions that will be displayed when there is no data being available.
84+
* **Custom content** – allows custom widgets to be displayed as the label instead of normal text values
85+
86+
#### Label
87+
88+
The **Label** section allows you to display labels for the combo box.
89+
90+
#### Conditional Visibility {#visibility}
91+
92+
For more information, see [Visibility Section](/refguide/common-widget-properties/#visibility-properties) in *Properties Common in the Page Editor*.
93+
94+
#### Editability Tab {#editability}
95+
96+
For more information, see [Editability Section](/refguide/common-widget-properties/#editability) in *Properties Common in the Page Editor*.
97+
98+
### Events Tab {#events}
99+
100+
The following configurations are available:
101+
102+
* **On change** – executes an action when the attribute value changes
103+
104+
### Accessibility Tab {#accessibility}
105+
106+
The **Accessibility** tab allows you to configure settings for combo box accessibility features.
107+
108+
### Common Tab {#common}
109+
110+
For more information, see [Common Section](/refguide/common-widget-properties/#common-properties) in *Properties Common in the Page Editor*.
111+
112+
## Styling
113+
114+
### Design Properties Section {#design-properties}
115+
116+
{{% snippet file="/static/_includes/refguide/design-section-link.md" %}}
117+
118+
### Common Section {#common-styling}
119+
120+
{{% snippet file="/static/_includes/refguide/common-section-link.md" %}}

0 commit comments

Comments
 (0)