Multi-Select Dropdown Component

The Multi-Select Dropdown component lets end-users select one or more options from a searchable drop-down list. Options can be defined manually, fetched from a URL, or loaded from another field. It includes advanced options for auto-selection behavior, clear buttons, item templates, and more.

How to read settings tables

The tables below describe each configurable option as it displays in the Unqork IDE. Values are formatted as follows: inline code — a value to type exactly as shown | Bold — a value selected from a drop-down, radio button, tab, or choice chip | ON/OFF — toggle state | ✓ — checkbox checked | ☐ — checkbox unchecked

General Settings

Setting	Field	Type	Default	Description
Property ID	`key`	Text input	`udMultiSelect`	The unique identifier for this component instance.

Display Settings

Field Text

Setting	Field	Type	Default	Description
Label Text	`label`	Text input	—	Identifies the component on the canvas and informs end-users what information is requested.
Placeholder Text	`placeholder`	Text input	—	Hint text displayed inside the drop-down before a selection is made.

Contextual Help

Setting	Field	Type	Default	Description
Tooltip	`description`	Text input	—	A brief description that displays when a cursor is positioned over the tooltip icon.

Formatting

Setting	Field	Type	Default	Description
Allow Multiple Selections	`multiple`	Toggle	OFF	Lets end-users select more than one option from the list.
Auto-select Highlighted Option When Clicking Outside	`autoSelectOnExit`	Toggle	ON	Automatically selects the highlighted option when the end-user clicks outside the drop-down.
Show Clear Button	`showClearButton`	Toggle	OFF	Displays a button that clears the currently selected value.
Hide Chevron	`hideChevron`	Toggle	OFF	Hides the drop-down chevron icon.
Set Dropdown Menu Height	`limitToRows`	Number input	—	Limits the number of rows visible in the drop-down menu simultaneously.
Item Template	`template`	Text input	`<span>{{ item.label }}</span>`	An HTML template for rendering each option in the drop-down list.

Default State Options

Setting	Field	Type	Default	Description
Input Behavior	—	Drop-down	Enable User Input	Sets how end-users can interact with the field.
Hide Field	`hidden`	Toggle	OFF	Hides the component from end-users but always displays in the Module Builder.

Enable User Input (default): End-users can make selections in the drop-down.

Disable User Input (disabled): Prevents end-users from making a selection. The component displays with an altered appearance to indicate it is not editable.

Read Only - Legacy (readOnlyView): Displays the stored value as plain text without the drop-down input. Shows None when empty.

Data Settings

Data Source Type

Setting	Field	Type	Default	Description
Data Source Type	`dataSrc`	Choice chip	Values	Sets how options are loaded.

Values — Manually define a list of options.

Column Field Type Description

Option Label label Text input The display text shown to end-users for each option.

Data Source Values value Text input The value stored when the option is selected.

Column	Field	Type	Description
Option Label	`label`	Text input	The display text shown to end-users for each option.
Data Source Values	`value`	Text input	The value stored when the option is selected.

URL — Fetch options from an external endpoint.

HTTP request headers to include with the data fetch:

Column Field Type Description

Request Header label Text input The HTTP request header name.

Header Values value Text input The value for the header.

Setting Field Type Default Description

Service service Service selector — A configured service to use as the data source.

Data Source URL data.url Text input — A URL that returns a JSON array to use as the option source.

Data Path selectValues Text input — The property path in the response where iterable items reside.

Filter query filter Text input — Additional filtering using query parameters.

Refresh On refreshOn Property ID — Triggers a data refresh when the specified field changes.

Limit Number of Items limit Number input — Limits the number of items returned per page.

Disable Limiting Response data.disableLimit Toggle OFF Excludes limit and skip parameters from the query string.

Search Parameters are Required hasRequiredFields Toggle OFF Prevents the fetch from executing if required search parameters are absent.

Clear Value On Refresh data.clearOnRefresh Toggle OFF Clears the selected value when the Refresh On field changes.

Authenticate data.authenticate Toggle OFF Sends authentication headers from the application with the request.

Disable filter application preventInnerFilter Toggle OFF Prevents the component from applying its internal filter to results.

Value Property valueProperty Text input — The property in each item to use as the stored value.

Search Query Name searchField Text input — The URL query parameter name used to send the end-user's search text to the server.

Refresh Delay refreshDelay Number input 250 Sets the delay after the end-user stops typing before sending the search request, in milliseconds (ms).

Column	Field	Type	Description
Request Header	`label`	Text input	The HTTP request header name.
Header Values	`value`	Text input	The value for the header.

Setting	Field	Type	Default	Description
Service	`service`	Service selector	—	A configured service to use as the data source.
Data Source URL	`data.url`	Text input	—	A URL that returns a JSON array to use as the option source.
Data Path	`selectValues`	Text input	—	The property path in the response where iterable items reside.
Filter query	`filter`	Text input	—	Additional filtering using query parameters.
Refresh On	`refreshOn`	Property ID	—	Triggers a data refresh when the specified field changes.
Limit Number of Items	`limit`	Number input	—	Limits the number of items returned per page.
Disable Limiting Response	`data.disableLimit`	Toggle	OFF	Excludes limit and skip parameters from the query string.
Search Parameters are Required	`hasRequiredFields`	Toggle	OFF	Prevents the fetch from executing if required search parameters are absent.
Clear Value On Refresh	`data.clearOnRefresh`	Toggle	OFF	Clears the selected value when the Refresh On field changes.
Authenticate	`data.authenticate`	Toggle	OFF	Sends authentication headers from the application with the request.
Disable filter application	`preventInnerFilter`	Toggle	OFF	Prevents the component from applying its internal filter to results.
Value Property	`valueProperty`	Text input	—	The property in each item to use as the stored value.
Search Query Name	`searchField`	Text input	—	The URL query parameter name used to send the end-user's search text to the server.
Refresh Delay	`refreshDelay`	Number input	`250`	Sets the delay after the end-user stops typing before sending the search request, in milliseconds (ms).

Data Reference key — Load options from another module field.

Setting Field Type Default Description

Data Reference Key data.dataReferenceKey Property ID — The Property ID of a field that returns a JSON array to use as the option source.

Limit Number of Items labelPath Number input — Limits the number of items returned.

Refresh On refreshOn Property ID — Triggers a data refresh when the specified field changes.

Setting	Field	Type	Default	Description
Data Reference Key	`data.dataReferenceKey`	Property ID	—	The Property ID of a field that returns a JSON array to use as the option source.
Limit Number of Items	`labelPath`	Number input	—	Limits the number of items returned.
Refresh On	`refreshOn`	Property ID	—	Triggers a data refresh when the specified field changes.

Data Storage

Setting	Field	Type	Default	Description
Store Data in Database	`persistent`	Toggle	ON	When set to ON, this setting this setting stores field values to the database when the module saves, end-users navigate between Panel components, or end-users navigate between workflow screens. Set to OFF to exclude this field from server-side submissions.

Note: Fields with Store Data in Database set to OFF are excluded from Plug-In component's API responses and Unqork's built-in tracker. When using a Plug-In component to remote-execute a module, any component whose value must be included in the API response requires Store Data in Database set to ON.

Actions Settings

Triggers

Setting	Field	Type	Default	Description
Trigger	`listener`	Property ID	—	Triggers another component when the selection changes.

Validation Settings

User Input

Setting	Field	Type	Default	Description
Required	`validate.required`	Toggle	OFF	Requires a selection before the module can be submitted.
Required Error Message	`errors.required`	Text input	`is required`	Displays when the required field has no selection.

Advanced Settings

Setting	Field	Type	Default	Description
Require Unique Submission Data	`unique`	Toggle	OFF	Ensures the selected value has not been submitted before in another submission.
Don't Allow Unique Values	`noValueAdjust`	Toggle	OFF	Prevents end-users from adding a value that does not already exist in the option list.
custom CSS class	`customClass`	Text input	—	A CSS class applied to the component for custom styling.

Changelog

Date	Change
—	Initial publication.

Documentation Index