> For the complete documentation index, see [llms.txt](https://appmaster.gitbook.io/docs/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://appmaster.gitbook.io/docs/web-apps/components-list/select-enum.md).

# Select (enum)

Select component to select Enumeration type of objects.

## Initial settings

**Data source** - *enum* type of object 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.

![](https://3563768697-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MapxHzVskQ_27pNUTT4-1972196547%2Fuploads%2F8j5sQouCUNLyMiNRLDm8%2Finitial_settings.jpg?alt=media\&token=d13fbfef-fb43-4098-a6f6-1d745fd9389e)

## Look\&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.

![](https://3563768697-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MapxHzVskQ_27pNUTT4-1972196547%2Fuploads%2Filxv10yCiu8laxRnH9KO%2Flook_and_feel.jpg?alt=media\&token=e65e9852-583c-41c6-88d9-7020e32f2c10)

## Data

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

![](https://3563768697-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MapxHzVskQ_27pNUTT4-1972196547%2Fuploads%2Fr4xiwEm0fdB26748Csbx%2Fdata.jpg?alt=media\&token=99dc2500-649b-4db2-9f1a-7ccf44b64c68)

## Workflow triggers

* **onChange** - fires when the component's state is change.
* **onFocus** - fires when the *Select (enum)* component is being focused on.
* **onBlur** - fires when the *Select (enum)* component is blurred.
* **onCreate -** fires when the component is created.
* **onDestroy** - fires when the component is destroyed. 

## Component Actions

### Select Enum Get Properties

Gets the component's properties.

**Input** parameters:

* **Component Id** \[string] *-* Select Enum component's identifier;

**Output** parameters:

* **Selected** \[*enum / enum array*] - selected option(s). To be shown in the business process when the **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

![](https://3563768697-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MapxHzVskQ_27pNUTT4-1972196547%2Fuploads%2FTrYuqfXk9APesehEvXxs%2Fworkflow_getProperties.jpg?alt=media\&token=b372490a-7fe2-4d54-a03a-9dd0bf6a9e82)

### Select Enum Set Properties

Sets the component's properties.

**Input** parameters:

* **Selected** \[*enum*/ *enum array*] - selected option(s). To be shown in the business process when the **Component ID** is specified only.
* **Component Id** \[string] *-* 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

![](https://3563768697-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MapxHzVskQ_27pNUTT4-1972196547%2Fuploads%2FYu3eRQvjtiCGWCkzOYym%2Fworkflow_setProperties.jpg?alt=media\&token=5c774d10-013c-407d-b94e-13d94c00f85e)

### Select Enum Update Properties

Updates component's properties.

**Input** parameters:

* **Selected** \[*enum*/ *enum array*] - selected option(s). To be shown in the business process when the **Component ID** is specified only.
* **Component Id** \[string] *-* 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

## Usage example

It is possible to make some options to be preselected in the *Select (Enum)* component. 

The logic should be following:

* Drag and drop **Select Enum Set Properties** business process block into the canvas.

![](https://3563768697-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MapxHzVskQ_27pNUTT4-1972196547%2Fuploads%2FLy6NUiY3b6nCTr3qcw2f%2Fexample_1.jpg?alt=media\&token=e34856b7-e233-4acb-bad9-b295aa2b581c)

* Define the **Component ID** to make **Selected** property visible for configuring.

![](https://3563768697-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MapxHzVskQ_27pNUTT4-1972196547%2Fuploads%2FwS5ghArwgdwGlP6ZurQj%2Fexample_2.jpg?alt=media\&token=39299423-4f1f-48d3-8f10-09dde715607a)

* Once **Selected** is available, define the value as needed.

![](https://3563768697-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MapxHzVskQ_27pNUTT4-1972196547%2Fuploads%2FP0fryIAtdmUyOewQr2Ev%2Fexample_3.jpg?alt=media\&token=431a7b67-f3a4-4b86-8e74-f03c985e73f8)

* This logic should work when the component is created (**onCreate**).

![](https://3563768697-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MapxHzVskQ_27pNUTT4-1972196547%2Fuploads%2F2QEe12OPEemRxGWaGyu9%2Fexample_4.jpg?alt=media\&token=03eea820-5b1f-4022-8e3d-b773e28e8a9b)