Relselect

Click to copy

Select component to select values from Data Models.


Initial settings 

Data source - data model to be used to show dropdown options from.

Mode - choose Multiple for being able to select multiple options from the dropdown. Otherwise, Single mode should be used.


Look and Feel Settings

Label (not mantory) to be used to show the component's label.

Placeholder (not mandatory) to be used to show the component's placeholder.

Name (mandatory) - name of the component.

Size (mandatory) - size of the component. Is set to Default when component is created.

Search (mandatory) - to be able to search within available dropdown options. Is turned off by default. 

Clear icon (mandatory) - shows clear options icon if enabled. Is turned off by default.

Disabled (mandatory) - makes the component disabled if turned on. Is turned off by default.

Visible (mandatory) - makes the component visible if turned on. Enabled by default.


Data

Data source - Data Model in use. Configurable only on component's creation.

Label - Data Model fields to be showed in a single dropdown option.


Workflow triggers

  • onChange - fires when the dropdown option changed.
  • onFocus - fires when Relselect component is being focused.
  • onBlur - fires when Relselect component is blurred.
  • onCreate - fires when the component is created.
  • onShow - fires when the component is shown.
  • onHide - fires when the component is hidden.
  • onSearch - fires when user searches withing available options.
  • onOpen - fires on the dropdown.
  • onLoadAll - fires when all dropdown options are downloaded.

Component Actions

RelSelect Get Properties

Gets the component's properties.

Input parameters:

  • Component Id [string] - RelSelect component's identifier;

Output parameters:

  • Selected [Data Model type/ Data Model Array type] - selected option(s). To be shown in the business process when Component ID is specified only.
  • Data [Data Model Array type] - array of Data Model elements to be used. Available in the business process when Component ID is specified only.
  • Label [string] - component's label;
  • Placeholder [string] - component's placeholder;
  • Allow Clear [boolean] - allows clear the selection if true;
  • Disable [boolean] - disables component if true;
  • Tooltip [string] - tooltip string;
  • Required Mark [boolean] - shows required mark if true;
  • Debounce (ms) [integer] - delay to validate the value;
  • Validate Icon [boolean] - icon to be shown on validate the value;
  • Validate Status [Status type] - status to be shown on validate the value; 
  • Validate Message [string] - message to be shown on validate the value.

RelSelect Get Properties

RelSelect Set Properties

Sets the component's properties.

Input parameters:

  • Component Id [string] - RelSelect component's identifier;
  • Label [string] - component's label;
  • Placeholder [string] - component's placeholder;
  • Allow Clear [boolean] - allows clear the selection if true;
  • Disable [boolean] - disables component if true;
  • Tooltip [string] - tooltip string;
  • Required Mark [boolean] - shows required mark if true;
  • Debounce (ms) [integer] - delay to validate the value;
  • Validate Icon [boolean] - icon to be shown on validate the value;
  • Validate Status [Status type] - status to be shown on validate the value; 
  • Validate Message [string] - message to be shown on validate the value.

RelSelect Set Properties

RelSelect Update Properties

Updates component's properties.

Input parameters:

  • Selected [Data Model type/ Data Model Array type] - selected option(s). To be shown in the business process when Component ID is specified only.
  • Data [Data Model Array type] - array of Data Model elements to be used. Available in the business process when Component ID is specified only.
  • Component Id [string] - RelSelect component's identifier;
  • Label [string] - component's label;
  • Placeholder [string] - component's placeholder;
  • Allow Clear [boolean] - allows clear the selection if true;
  • Disable [boolean] - disables component if true;
  • Tooltip [string] - tooltip string;
  • Required Mark [boolean] - shows required mark if true;
  • Debounce (ms) [integer] - delay to validate the value;
  • Validate Icon [boolean] - icon to be shown on validate the value;
  • Validate Status [Status type] - status to be shown on validate the value; 
  • Validate Message [string] - message to be shown on validate the value.

RelSelect Get Properties


Usage example

It is required to download the dropdown options from the server in order to see them. 

The logic should be following:

1.Get the Data Model Array (Server request GET) on RelSelect component's creation (onCreate).

2.Update the dropdown data (RelSelect Update Properties)