---
title: "Vega Search Select Component"
slug: "vega-search-select-component"
updated: 2025-09-26T05:45:17Z
published: 2025-09-26T05:45:17Z
canonical: "docs.unqork.io/vega-search-select-component"
---

> ## Documentation Index
> Fetch the complete documentation index at: https://docs.unqork.io/llms.txt
> Use this file to discover all available pages before exploring further.

# Vega Search Select Component

UDesignerClassic Designer

## Overview

The **Search Select component** is a [Primary Fields component](/v1/docs/primary-fields-components) that lets end-users search for, or select, one or more options from a drop-down list. Unlike the [Simple Select](/v1/docs/vega-simple-select-component) component, end-users can enter a value into the field and the drop-down list filters options to match that value. End-users then use the arrow keys or their mouse to select an option from the filtered list.

By default, the Search Select component remains collapsed until the end-user clicks it. After making a selection, the list closes again.

You'll find the Search Select component in the [Primary Fields](/v1/docs/primary-fields-components) group to the left of the [Module Builder](/v1/docs/introduction-to-the-module-builder).

## About the Configuration Window

> To learn more about general component settings and those that display when a component is associated with Data Models, view our [General Component Settings](/v1/docs/general-component-settings) article.

## Display

### Field Text

[![A static image displaying the Search Select component's Display settings.](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/uD_Display_thumb_0_0.jpg?sv=2026-02-06&spr=https&st=2026-11-09T03%3A51%3A17Z&se=2026-11-09T04%3A51%3A17Z&sr=c&sp=r&sig=L9%2BeQ99EkgULlbvCkzRjpCCAD45XkwTpvfnLU%2BMhh4Q%3D)](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/uD%20Display.jpg?sv=2026-02-06&spr=https&st=2026-11-09T03%3A51%3A17Z&se=2026-11-09T04%3A51%3A17Z&sr=c&sp=r&sig=L9%2BeQ99EkgULlbvCkzRjpCCAD45XkwTpvfnLU%2BMhh4Q%3D)

| Setting | Description |
| --- | --- |
| **Label Text** | Label Text conveys what the input component is and what information it displays. Enter the purpose of the corresponding component or field. User-friendly labels make your module more accessible. Keep labels short and descriptive (a word or two) using title case. For longer entries, use sentence case. |
| **Placeholder Text** | A short prompt telling end-users the expected value of an input field. For example, `Enter your Social Security Number`. Placeholder Text displays inside the input field until the end-user begins an entry. |

### Formatting

| Setting | Description |
| --- | --- |
| **Allow Multiple Selections** | When set to ![A toggle switch indicating an on/off state for a user interface element.](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/Group 1.png?sv=2026-02-06&spr=https&st=2026-11-09T03%3A51%3A17Z&se=2026-11-09T04%3A51%3A17Z&sr=c&sp=r&sig=L9%2BeQ99EkgULlbvCkzRjpCCAD45XkwTpvfnLU%2BMhh4Q%3D) (ON), end-users can select multiple options from the drop-down. Each time the end-user clicks an option, its added to the field. |
| **Allow Option Creation** | When set to ![A toggle switch indicating an on/off state for a user interface element.](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/Group 1.png?sv=2026-02-06&spr=https&st=2026-11-09T03%3A51%3A17Z&se=2026-11-09T04%3A51%3A17Z&sr=c&sp=r&sig=L9%2BeQ99EkgULlbvCkzRjpCCAD45XkwTpvfnLU%2BMhh4Q%3D) (ON), end-users can manually add option values in Express View. End-users enter text in the component's value field to create a new option from the list. End-users then submit this new option by pressing **Enter** (Return) on their keyboard. > [!NOTE] > This setting applies even if **Allow Multiple Selections** is set to ![A toggle switch indicating an on/off state for a user interface element.](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/Group 1.png?sv=2026-02-06&spr=https&st=2026-11-09T03%3A51%3A17Z&se=2026-11-09T04%3A51%3A17Z&sr=c&sp=r&sig=L9%2BeQ99EkgULlbvCkzRjpCCAD45XkwTpvfnLU%2BMhh4Q%3D) (ON) Consider the following limitations: - End-users might submit duplicate values. - Enabling the setting using the [Operations Builder](/v1/docs/introduction-to-the-operations-builder) does not update the options. |
| **Render Select Menu as Portal** | When set to ![A toggle switch indicating an on/off state for a user interface element.](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/Group 1.png?sv=2026-02-06&spr=https&st=2026-11-09T03%3A51%3A17Z&se=2026-11-09T04%3A51%3A17Z&sr=c&sp=r&sig=L9%2BeQ99EkgULlbvCkzRjpCCAD45XkwTpvfnLU%2BMhh4Q%3D) (ON), in Express View, the search select field is rendered in the HTML body of the DOM. When set to ![A toggle switch in the 'on' position, indicating an active setting or feature.](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/Group 2(1).png?sv=2026-02-06&spr=https&st=2026-11-09T03%3A51%3A17Z&se=2026-11-09T04%3A51%3A17Z&sr=c&sp=r&sig=L9%2BeQ99EkgULlbvCkzRjpCCAD45XkwTpvfnLU%2BMhh4Q%3D) (OFF), the Search Select field nests in its parent container. By default this setting is ![A toggle switch indicating an on/off state for a user interface element.](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/Group 1.png?sv=2026-02-06&spr=https&st=2026-11-09T03%3A51%3A17Z&se=2026-11-09T04%3A51%3A17Z&sr=c&sp=r&sig=L9%2BeQ99EkgULlbvCkzRjpCCAD45XkwTpvfnLU%2BMhh4Q%3D) (ON). |

## Data

### Store Data in Database

[![A static image displaying the Search Select component's Data settings.](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/uD_Data_thumb_0_0.jpg?sv=2026-02-06&spr=https&st=2026-11-09T03%3A51%3A17Z&se=2026-11-09T04%3A51%3A17Z&sr=c&sp=r&sig=L9%2BeQ99EkgULlbvCkzRjpCCAD45XkwTpvfnLU%2BMhh4Q%3D)](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/uD%20Data.jpg?sv=2026-02-06&spr=https&st=2026-11-09T03%3A51%3A17Z&se=2026-11-09T04%3A51%3A17Z&sr=c&sp=r&sig=L9%2BeQ99EkgULlbvCkzRjpCCAD45XkwTpvfnLU%2BMhh4Q%3D)

| Setting | Description |
| --- | --- |
| **Store Data in Database** | The Store Data in Database setting affects how data persists through your application. When set to ![A toggle switch indicating an on/off state for a user interface element.](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/Group 1.png?sv=2026-02-06&spr=https&st=2026-11-09T03%3A51%3A17Z&se=2026-11-09T04%3A51%3A17Z&sr=c&sp=r&sig=L9%2BeQ99EkgULlbvCkzRjpCCAD45XkwTpvfnLU%2BMhh4Q%3D) (ON), Unqork stores values entered into the field to the database (server-side submission). This occurs in three scenarios: - Navigating between Panels in a Navigation component. On navigation between pages (Panels), the component’s value saves to the database. - Triggering a module save event using a Button component with an Action Type of Save. - Navigating between screens of a workflow. On navigation between screens, the component’s value saves to the database. > [!NOTE] > By default, workflows persist data from all fields in the client-side submission when navigating between screens. However, only values from fields with Store Data in Database enabled store in the server-side submission. Set the toggle to ![A toggle switch in the 'on' position, indicating an active setting or feature.](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/Group 2(1).png?sv=2026-02-06&spr=https&st=2026-11-09T03%3A51%3A17Z&se=2026-11-09T04%3A51%3A17Z&sr=c&sp=r&sig=L9%2BeQ99EkgULlbvCkzRjpCCAD45XkwTpvfnLU%2BMhh4Q%3D) (OFF) when you don’t want to store the values from this field in the database. > [!NOTE] > When using a Plug-In to remote execute a module, ensure data moving between modules is persistent. You can optionally enable Store Data in Database for components in the source module. But any components in the API module whose values are included in an API response must have Store Data in Database enabled. When a component’s data is not persistent, the data isn't included in an API call's response. So, Plug-Ins or external services requesting data from the API module can't receive non-persistent data in the response. > [!TIP] > Store Data in Database also affects what data is tracked using Unqork’s built-in tracker. When the **Enable Tracker** and **Track Value** toggles are set to (ON) in Module Settings, only values from fields with Store Data in Database enabled are tracked. |

### Data Source Type

**Values**

Selecting Values displays a table where you can enter each option and its value.

| Setting | Description |
| --- | --- |
| **Label** | Enter the text that displays to the end-user. When an end-user clicks the text, the **Action** setting fires. |
| **Value** | Create a key value for targeting the option. For example, if you have three options in your menu, you could assign the following keys: `menu1`, `menu2`, `menu3`. |

## Adding a Search Select Component

You'll configure a Search Select component to collect an end-user's cat type preference. You'll configure eight options for end-users to select.

> [!NOTE]
> These instructions assume that you have an open module saved with a title.

1. In the Module Builder, drag and drop a Search Select component onto the canvas.
2. In the Property ID field, enter **catType**.
3. In the Label Text field, enter `What is your favorite cat breed?`.
4. In the component's configuration menu, click **D****ata**.
5. In the **Values** table, enter the following:

|  | **Key** | **Option Label** |
| --- | --- | --- |
| 1 | bengal | Bengal |
| 2 | sphynx | Sphynx |
| 3 | tabby | Tabby |
| 4 | maineCoon | Maine Coon |
| 5 | ragDoll | Rag Doll |
| 6 | britishShorthair | British Shorthair |
| 7 | americanShorthair | American Shorthair |
| 8 | exoticShorthair | Exotic Shorthair |

[![A static image displaying the catType Search Select component's data settings. The Data Values data is filled out.](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/SearchSelect_Example_2_thumb_0_0.jpg?sv=2026-02-06&spr=https&st=2026-11-09T03%3A51%3A17Z&se=2026-11-09T04%3A51%3A17Z&sr=c&sp=r&sig=L9%2BeQ99EkgULlbvCkzRjpCCAD45XkwTpvfnLU%2BMhh4Q%3D)](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/SearchSelect%20Example%202.jpg?sv=2026-02-06&spr=https&st=2026-11-09T03%3A51%3A17Z&se=2026-11-09T04%3A51%3A17Z&sr=c&sp=r&sig=L9%2BeQ99EkgULlbvCkzRjpCCAD45XkwTpvfnLU%2BMhh4Q%3D)
6. Click **Save & Close**.
7. **Save** your module.

Your Search Select component looks like the following in Express View:

[An animated image displaying the Search Select component in Express View. The End-User searches for an option from the drop-down.](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/SearchSelect_ExpressView(1).webm?sv=2026-02-06&spr=https&st=2026-11-09T03%3A51%3A17Z&se=2026-11-09T04%3A51%3A17Z&sr=c&sp=r&sig=L9%2BeQ99EkgULlbvCkzRjpCCAD45XkwTpvfnLU%2BMhh4Q%3D)

## Structure of a Search Select Component's Data

Using the above example, execute the [Vega Console](/v1/docs/vega-console) command UNQENG.tools.getComponentState('**catType**') in the DevTools Console to display the component's data structure.

Here's how the above example looks after selecting an option in Express View:

[![A static image displaying a Search Select component with a single-selection.](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/SearchSelect_DataStructure_Express_thumb_0_0.jpg?sv=2026-02-06&spr=https&st=2026-11-09T03%3A51%3A17Z&se=2026-11-09T04%3A51%3A17Z&sr=c&sp=r&sig=L9%2BeQ99EkgULlbvCkzRjpCCAD45XkwTpvfnLU%2BMhh4Q%3D)](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/SearchSelect%20DataStructure%20Express.jpg?sv=2026-02-06&spr=https&st=2026-11-09T03%3A51%3A17Z&se=2026-11-09T04%3A51%3A17Z&sr=c&sp=r&sig=L9%2BeQ99EkgULlbvCkzRjpCCAD45XkwTpvfnLU%2BMhh4Q%3D)

Here's how the same component looks in the DevTools Console:

[![A static image displaying a Search Select component in the DevTools Console view.](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/SearchSelect_DataStructure_thumb_0_0.jpg?sv=2026-02-06&spr=https&st=2026-11-09T03%3A51%3A17Z&se=2026-11-09T04%3A51%3A17Z&sr=c&sp=r&sig=L9%2BeQ99EkgULlbvCkzRjpCCAD45XkwTpvfnLU%2BMhh4Q%3D)](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/SearchSelect%20DataStructure.jpg?sv=2026-02-06&spr=https&st=2026-11-09T03%3A51%3A17Z&se=2026-11-09T04%3A51%3A17Z&sr=c&sp=r&sig=L9%2BeQ99EkgULlbvCkzRjpCCAD45XkwTpvfnLU%2BMhh4Q%3D)

| > [!TIP] > |
| --- |

## **Overview**

The **Search Select component** is a [Primary Fields component](https://portal.us.document360.io/v1/docs/primary-fields-components) that lets [end-users](https://portal.us.document360.io/#) search for, or select, one or more options from a drop-down list. Unlike the [Simple Select](https://portal.us.document360.io/v1/docs/vega-simple-select-component) component, end-users can enter a value into the field and the drop-down list filters options to match that value. End-users then use the arrow keys or their mouse to select an option from the filtered list.

By default, the Search Select component remains collapsed until the end-user clicks it. After making a selection, the list closes again.

You'll find the Search Select component in the [Primary Fields](https://portal.us.document360.io/v1/docs/primary-fields-components) group to the left of the [Module Builder](https://portal.us.document360.io/v1/docs/introduction-to-the-module-builder).

## **About the Configuration Window**

> To learn more about general component settings and those that display when a component is associated with Data Models, view our [General Component Settings](https://portal.us.document360.io/v1/docs/general-component-settings) article.

## **Display Panel**

![](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/SearchSelect_Display_thumb_0_0(2).jpg?sv=2026-02-06&spr=https&st=2026-11-09T03%3A51%3A17Z&se=2026-11-09T04%3A51%3A17Z&sr=c&sp=r&sig=L9%2BeQ99EkgULlbvCkzRjpCCAD45XkwTpvfnLU%2BMhh4Q%3D)

### **Field Text**

| **Setting** | **Description** |
| --- | --- |
| **Label Text** | Label Text conveys what the input component is and what information it displays. Enter the purpose of the corresponding component or field. User-friendly labels make your module more accessible. Keep labels short and descriptive (a word or two) using title case. For longer entries, use sentence case. |
| **Placeholder Text** | A short prompt telling end-users the expected value of an input field. For example, `Enter your Social Security Number`. Placeholder Text displays inside the input field until the end-user begins an entry. |

### **Formatting**

| **Setting** | **Description** |
| --- | --- |
| **Allow Multiple Selections** | When set to ![A toggle switch indicating an on/off state for a user interface element.](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/Group 1.png?sv=2026-02-06&spr=https&st=2026-11-09T03%3A51%3A17Z&se=2026-11-09T04%3A51%3A17Z&sr=c&sp=r&sig=L9%2BeQ99EkgULlbvCkzRjpCCAD45XkwTpvfnLU%2BMhh4Q%3D) **(ON)**, end-users can select multiple options from the drop-down. Each time the end-user clicks an option, its added to the field. |
| **Render Select Menu as Portal** | When set to![A toggle switch indicating an on/off state for a user interface element.](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/Group 1.png?sv=2026-02-06&spr=https&st=2026-11-09T03%3A51%3A17Z&se=2026-11-09T04%3A51%3A17Z&sr=c&sp=r&sig=L9%2BeQ99EkgULlbvCkzRjpCCAD45XkwTpvfnLU%2BMhh4Q%3D) **(ON)**, in [Express View](https://portal.us.document360.io/#), the search select field is rendered in the HTML body of the [DOM](https://portal.us.document360.io/#). When set to ![A toggle switch in the 'on' position, indicating an active setting or feature.](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/Group 2(1).png?sv=2026-02-06&spr=https&st=2026-11-09T03%3A51%3A17Z&se=2026-11-09T04%3A51%3A17Z&sr=c&sp=r&sig=L9%2BeQ99EkgULlbvCkzRjpCCAD45XkwTpvfnLU%2BMhh4Q%3D) **(OFF)**, the Search Select field nests in its parent container. By default this setting is ![A toggle switch indicating an on/off state for a user interface element.](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/Group 1.png?sv=2026-02-06&spr=https&st=2026-11-09T03%3A51%3A17Z&se=2026-11-09T04%3A51%3A17Z&sr=c&sp=r&sig=L9%2BeQ99EkgULlbvCkzRjpCCAD45XkwTpvfnLU%2BMhh4Q%3D) (ON). |

## **Data Panel**

![](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/SearchSelect_Data_thumb_0_0(6).jpg?sv=2026-02-06&spr=https&st=2026-11-09T03%3A51%3A17Z&se=2026-11-09T04%3A51%3A17Z&sr=c&sp=r&sig=L9%2BeQ99EkgULlbvCkzRjpCCAD45XkwTpvfnLU%2BMhh4Q%3D)

### **Data Source Type**

`Values`

Selecting Values displays a table where you can enter each option and its value.

| **Setting** | **Description** |
| --- | --- |
| **Key** | Create a key value for targeting the option. For example, if you have three options in your menu, you could assign the following keys: `menu1`, `menu2`, `menu3`. |
| **Option Label** | Enter the text that displays to the end-user. When an end-user clicks the text, the **Action** setting fires. |

### **Data Storage**

| **Setting** | **Description** |
| --- | --- |
| **Store Data in Database** | The Store Data in Database setting affects how data persists through your application. When set to ![A toggle switch indicating an on/off state for a user interface element.](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/Group 1.png?sv=2026-02-06&spr=https&st=2026-11-09T03%3A51%3A17Z&se=2026-11-09T04%3A51%3A17Z&sr=c&sp=r&sig=L9%2BeQ99EkgULlbvCkzRjpCCAD45XkwTpvfnLU%2BMhh4Q%3D) **(ON)**, Unqork stores values entered into the field to the database (server-side submission). This occurs in three scenarios: - Navigating between Panels in a Navigation component. On navigation between pages (Panels), the component’s value saves to the database. - Triggering a module save event using a Button component with an Action Type of Save. - Navigating between screens of a workflow. On navigation between screens, the component’s value saves to the database. > [!NOTE] > By default, workflows persist data from all fields in the client-side submission when navigating between screens. However, only values from fields with Store Data in Database enabled store in the server-side submission. Set the toggle to![A toggle switch in the 'on' position, indicating an active setting or feature.](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/Group 2(1).png?sv=2026-02-06&spr=https&st=2026-11-09T03%3A51%3A17Z&se=2026-11-09T04%3A51%3A17Z&sr=c&sp=r&sig=L9%2BeQ99EkgULlbvCkzRjpCCAD45XkwTpvfnLU%2BMhh4Q%3D) **(OFF)** when you don’t want to store the values from this field in the database. > [!NOTE] > When using a Plug-In to remote execute a module, ensure data moving between modules is persistent. You can optionally enable Store Data in Database for components in the source module. But any components in the API module whose values are included in an API response must have Store Data in Database enabled. When a component’s data is not persistent, the data isn't included in an API call's response. So, Plug-Ins or external services requesting data from the API module can't receive non-persistent data in the response. > [!TIP] > Store Data in Database also affects what data is tracked using Unqork’s built-in tracker. When the **Enable Tracker** and **Track Value** toggles are set to ![A toggle switch indicating an on/off state for a user interface element.](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/Group 1.png?sv=2026-02-06&spr=https&st=2026-11-09T03%3A51%3A17Z&se=2026-11-09T04%3A51%3A17Z&sr=c&sp=r&sig=L9%2BeQ99EkgULlbvCkzRjpCCAD45XkwTpvfnLU%2BMhh4Q%3D) (ON) in Module Settings, only values from fields with Store Data in Database enabled are tracked. |

## Adding a Search Select Component

You'll configure a Search Select component to collect an end-user's cat type preference. You'll configure eight options for end-users to select.

> [!NOTE]
> These instructions assume that you have an open module saved with a title.

1. In the Module Builder, drag and drop a Search Select component onto the canvas.
2. In the Property ID field, enter **catType**.
3. In the Label Text field, enter `What is your favorite cat breed?`.
4. In the component's configuration menu, click **D****ata**.
5. In the **Values** table, enter the following:

|  | **Key** | **Option Label** |
| --- | --- | --- |
| 1 | bengal | Bengal |
| 2 | sphynx | Sphynx |
| 3 | tabby | Tabby |
| 4 | maineCoon | Maine Coon |
| 5 | ragDoll | Rag Doll |
| 6 | britishShorthair | British Shorthair |
| 7 | americanShorthair | American Shorthair |
| 8 | exoticShorthair | Exotic Shorthair |

[![A static image displaying the catType Search Select component's data settings. The Data Values data is filled out.](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/SearchSelect_Example_2_thumb_0_0.jpg?sv=2026-02-06&spr=https&st=2026-11-09T03%3A51%3A17Z&se=2026-11-09T04%3A51%3A17Z&sr=c&sp=r&sig=L9%2BeQ99EkgULlbvCkzRjpCCAD45XkwTpvfnLU%2BMhh4Q%3D)](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/SearchSelect%20Example%202.jpg?sv=2026-02-06&spr=https&st=2026-11-09T03%3A51%3A17Z&se=2026-11-09T04%3A51%3A17Z&sr=c&sp=r&sig=L9%2BeQ99EkgULlbvCkzRjpCCAD45XkwTpvfnLU%2BMhh4Q%3D)
6. Click **Save & Close**.
7. **Save** your module.

Your Search Select component looks like the following in Express View:

[An animated image displaying the Search Select component in Express View. The End-User searches for an option from the drop-down.](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/SearchSelect_ExpressView(1).webm?sv=2026-02-06&spr=https&st=2026-11-09T03%3A51%3A17Z&se=2026-11-09T04%3A51%3A17Z&sr=c&sp=r&sig=L9%2BeQ99EkgULlbvCkzRjpCCAD45XkwTpvfnLU%2BMhh4Q%3D)

## Structure of a Search Select Component's Data

Using the above example, execute the [Vega Console](/v1/docs/vega-console) command UNQENG.tools.getComponentState('**catType**') in the DevTools Console to display the component's data structure.

Here's how the above example looks after selecting an option in Express View:

[![A static image displaying a Search Select component with a single-selection.](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/SearchSelect_DataStructure_Express_thumb_0_0.jpg?sv=2026-02-06&spr=https&st=2026-11-09T03%3A51%3A17Z&se=2026-11-09T04%3A51%3A17Z&sr=c&sp=r&sig=L9%2BeQ99EkgULlbvCkzRjpCCAD45XkwTpvfnLU%2BMhh4Q%3D)](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/SearchSelect%20DataStructure%20Express.jpg?sv=2026-02-06&spr=https&st=2026-11-09T03%3A51%3A17Z&se=2026-11-09T04%3A51%3A17Z&sr=c&sp=r&sig=L9%2BeQ99EkgULlbvCkzRjpCCAD45XkwTpvfnLU%2BMhh4Q%3D)

Here's how the same component looks in the DevTools Console:

[![A static image displaying a Search Select component in the DevTools Console view.](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/SearchSelect_DataStructure_thumb_0_0.jpg?sv=2026-02-06&spr=https&st=2026-11-09T03%3A51%3A17Z&se=2026-11-09T04%3A51%3A17Z&sr=c&sp=r&sig=L9%2BeQ99EkgULlbvCkzRjpCCAD45XkwTpvfnLU%2BMhh4Q%3D)](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/SearchSelect%20DataStructure.jpg?sv=2026-02-06&spr=https&st=2026-11-09T03%3A51%3A17Z&se=2026-11-09T04%3A51%3A17Z&sr=c&sp=r&sig=L9%2BeQ99EkgULlbvCkzRjpCCAD45XkwTpvfnLU%2BMhh4Q%3D)

## Resources

- [Modify the Search Select component using the toolbar settings](/v1/docs/component-toolbar-settings).
- [Introduction to Primary Fields](/v1/docs/introduction-to-primary-fields).
- [Module Builder Component Library](/v1/docs/module-builder-component-library).

End-users, also known as Express Users, are the individuals accessing an application through Express View. In most cases, end-users are the customers using the product.

Express View is how your end-user views your application. Express View also lets you preview your applications to test your configuration and view the styling. This is also the view your end-users will see when interacting with your application. After configuring a module, click Preview in the Module Builder to interact with the module in Express View.

The Document Object Model (DOM) is the data representation of objects that form the structure and content of a document on the web. The DOM represents the page.

A Property ID is the unique field ID used by Unqork to track and link components in your module.

Label Text conveys what the input component is and what information it displays. Enter the purpose of the corresponding component or field.

The DevTools Console helps you securely store, build, test, and deploy your software.