Maintained reference:
customdropdownis the up-to-date version of this topic. This page keeps older notes and examples.
The Custom Dropdown Widget is a dynamic select input that can fetch options from an API or use a static list. It supports single or multiple selections, value binding, and dynamic population of the selected object.
This widget is designed for scenarios where dropdown options are dynamic or API-driven:
Dynamic Options: Fetches data from a REST API endpoint using a dataset configuration (url + dataField).
Single or Multiple Selection: Controlled via the multiple property.
Bind Selected Value:
bindValue empty → returns the full selected object.bindValue set → returns only the specified property of the selected item.Validation:
required: Ensures a value is selected when the field is mandatory.| Prop | Type | Description |
|---|---|---|
label |
string | Field label |
placeholder |
string | Placeholder text |
bindLabel |
string | Field of the option to display in the dropdown |
bindValue |
string | Field of the option to bind as value (empty string returns full object) |
multiple |
boolean | Allows selecting multiple items |
options |
array | Static options list (optional if using dataset) |
dataset |
object | Dynamic API config: { url, dataField } |
useBaseUrl |
boolean | Determines if the request uses the app’s base URL |
required |
boolean | Marks the field as mandatory |
Complete JSON Object
{
"key": "InputKey",
"type": "customdropdown",
"props": {
"label": "Input Name",
"required": true,
"placeholder": "Input Placeholder",
"bindLabel":"description",
"bindValue":"",
"multiple":false,
"options":[],
"useBaseUrl":true,
"dataset":{
"url":"https://example/categories"
"dataField":"data.content",
}
},
"validation": {
"messages": {
"required": "Error message for required"
}
}
}
Note: Setting the bindValue to empty string will return object of selected item which is preferred for dynamic Drop down field.
Allowed Custom Properties
See the props table in the maintained customdropdown reference.
Allowed Validations
validator-(n)