Select widget
The select widget enables selection from a list of items.
Example
Properties
Property |
Description |
Data type |
---|---|---|
|
ARIA label, which provides additional information about the element's purpose and functionality to assistive technologies, such as screen readers. If this is not provided, assistive technologies use |
string |
|
JSON containing the properties that define the visual appearance of the item, as described in Context properties. |
string (JSON) |
|
Name of event that fires when a user selects an option. |
string |
|
Default selection in the dropdown list before the user's selection, for example: "Choose your state." |
string |
|
Tooltip displayed below the input. |
string |
|
Unique identifier of this widget. |
string |
|
Array of text specifying the selection options. |
string |
|
Optional label text that gets displayed for check box control. |
string |
|
Default item. If empty, defaults to |
integer |
|
Indicates whether the engine sets focus to this widget. Default is If set to |
Boolean |
type
|
Rich-media type, which is always Select . |
string |
|
Array of text that is the actual value of each select item. If empty, text from the |
string |
Context properties
These are the context
properties.
Context property |
Description |
Data type |
---|---|---|
|
Label color, as a hex color code. |
string (hex color code) |
|
Label alignment, which is one of: |
enum |
|
Label size, in pixels. |
integer |
|
Label style, which is one of: |
enum |
controlContext properties
These are the controlContext
properties.
controlContext property |
Description |
Data type |
---|---|---|
|
Select border color, as a hex color code. |
string (hex color code) |
|
Select border radius, in pixels. |
integer |
|
Select border width, in pixels. |
integer |
|
Select left margin, in pixels. |
integer |
|
Select right margin, in pixels. |
integer |
Validation properties
Property |
Description |
Data type |
---|---|---|
|
Indicates whether user selection is required. |
Boolean |
Widget-specific expression evaluations
Property |
Description |
Data type |
---|---|---|
|
Example: |
integer |
|
Example: |
string |
Code sample
var obj = {
"widgetType": "form",
"nodes":
[{
"id": "widget1",
"controls": {
"0": {
"type": "Select",
"items": ["satisfactory", "excellent"],
"header": "Choose",
"label": "please select from the below",
"id": "select1",
"validation": {
"required": {
"error": "you must select something"
}
}
}
}
}
]
}