# Advanced Controls for Drop-downs

> The tutorials on this page demonstrate using drop-down lists with the **UiPath Form Designer**, inside the **Create Form Task** activity. The most used property for achieving the results in the tutorials is the **FormData(Collection)**.

The tutorials on this page demonstrate using drop-down lists with the **UiPath Form Designer**, inside the **Create Form Task** activity. The most used property for achieving the results in the tutorials is the **FormData(Collection)**.

## Creating dynamic drop-downs

Use them in workflows where you want to send dynamic data to populate a drop-down control inside a Form Action.

With this method, a variable of the type List of Strings holds the values of the drop-down list instead of adding static values on the **Data** tab in the **UiPath Form Designer**.

In the following example, we create a dynamic drop-down of countries, initialize a variable with the list of countries, and create an additional variable to capture the country selected by users.

![docs image](https://dev-assets.cms.uipath.com/assets/images/activities/activities-docs-image-187090-a0bd61d0.gif)

**To create a dynamic drop-down**:
1. In the **Create Form Task** activity, click the ellipsis (`...`) to the right of **FormData**.
2. Add an argument for the dynamic drop-down as follows:
   * Name: `countryList_dropdown`
   * Direction: **In**
   * Type: **List of Strings** (`List<String>`)
   * Value: Press **Ctrl** + **K** and enter `listOfCountries` as the variable name. 
      
     The `listOfCountries` variable contains the items in the drop-down list.

     :::note
     Array of Strings is also supported, but you must manually add the drop-down component in **Form Designer** and add the **Field Key** value.
     :::
3. If you want to get the user selection back to the workflow, add another argument to capture the selected value:
   * Name: `country` (the Field Key of the drop-down component)
   * Direction: **In/Out** or **Out**
   * Type: **String**
   * Value: Press **Ctrl** + **K** and enter `selectedCountry` as the variable name.
4. Click **OK** to close **Form Data**.
5. Open the **Variables** panel and initialize `listOfCountries` with the default value `new List(of string) from { "India", "Romania", "US" }`.
   :::tip
   You can also choose to populate `listOfCountries` through other activities instead of initializing it.
   :::

## Creating cascaded drop-downs

Use them in task-based forms when you want the selection in one drop-down (parent) to populate the values in the second drop-down (child).

   ![docs image](https://dev-assets.cms.uipath.com/assets/images/activities/activities-docs-image-187074-0a3b4391.gif)

**To create a cascaded drop-down:**
1. In the **Create Form Task** activity, click the ellipsis (`...`) to the right of **FormData**.
2. Bind the parent dropdown to the workflow.

   For this example, create an argument that passes the `listOfCountries` **List&lt;String&gt;** variable to the workflow as a dropdown list.

   :::note
   The `listOfCountries` variable contains the items in the parent drop-down list, meaning the list of countries.
   :::
   1. Name the argument `CountryList_dropdown`. The **Field Key** property name for this argument is `CountryList`.
   2. Set the **Direction** as **In** 
   3. Set the **Type** as `System.Collections.Generic.List<System.String>`
   4. Set the **Value** as the `listOfCountries` List&lt;String&gt; variable.
3. Bind the child dropdown to the workflow.

   For this example, create an argument that passes the `stateDictionaryList` **Dictionary&lt;String, List&lt;String&gt;&gt;** variable to the workflow as a dropdown list.

   :::note
   The `stateDictionaryList` variable contains the items in the child drop-down list, meaning the states for each country.
   :::
   1. Name the argument `stateDictList_dropdown`. The **Field Key** property name for this argument is `stateDictList`.
   2. Set the **Direction** as **In**
   3. Set the **Type** as `System.Collections.Generic.Dictionary<System.String, System.Collections.Generic.List<System.String>`
   4. Set the **Value** as the `stateDictionaryList` Dictionary&lt;String, List&lt;String&gt; variable
4. Bind the child dropdown to the parent dropdown.

   Create an argument with the name of the child dropdown and add the `_parent` suffix. Then set the **Value** of the argument to the name of the parent dropdown, like this: `”ParentDropdownVariableName”`.

   For this example, create an argument named `stateDictList_parent`. The child dropdown is `stateDictList` and you add the `_parent` suffix to it.
      1. Set the **Direction** as **In**.
      2. Set the **Type** as `String`.
      3. Set the **Value** as the `”CountryList”`.

   When populating the `stateDictList` Dictionary variable, take note that the dictionary **Key** is a value from the parent drop-down list and its corresponding **Value** is a list of options to be shown on the form if the parent is set to the key.

      :::tip
      You can pass the values to be pre-filled (for example, with country and state fields) in the **FormData** collection. If you are passing child values, make sure you also include the parent value to prevent unexpected behavior.
      :::
5. Map each value from the parent drop-down to a List of Strings variable. You can populate the list (dictionary) for the parent drop-down in any way, but for this example, we use an **Add to Dictionary** activity for each value.
   * **Dictionary**: the dictionary of the child drop-down, `stateDictList`.
   * **Key**: a value from the list of strings for the parent drop-down, `CountryList` - in this example, `"US"`, `"India"`, and `"Romania"`.
   * **Value**: Press **Ctrl** + **K** and enter a name for the List of Strings variable which holds the values to show in the child drop-down when the Key value is selected in the parent - `usaStatesList`, `indianStatesList`, and `romanianCountyList`, respectively.
6. Make sure you place the activity or activities for the above step before the **Create Form Task** activity.
7. Click **OK** to close **Form Data**.
8. Open the **Variables** panel and initialize the new List of String variables you created with the following default values:
    * for `indianStatesList`: `new List(of string) from { "Odisha", "Rajasthan", "Karnataka" }`
    * for `usaStatesList`: `new List(of string) from {"Florida", "Georgia", "Washington"}`
    * for `romanianCountyList`: `new List(of string) from {"Cluj", "Prahova", "Constanta"}`.

Download these examples [here](https://documentationexamplerepo.blob.core.windows.net/examples/Forms/Cascaded_and_Dynamic_Dropdowns_Sample.zip)

## Creating cascaded drop-downs in Edit Grid and Data Grid components

To use cascaded drop-downs inside a **Edit Grid** or **Data Grid** component:

1. Create the drop-down fields following the steps above (using the **FormData** wizard).
2. Open the Form Designer.
3. If the drop-down fields are not created inside your form, verify that:
   * The `<dropdownKey>` , `<dropdownKey>_dropdown`, and `<dropdownKey>_parent` arguments are correctly added in the **FormData** collection.
   * The **GenerateInputFields** box is checked.
4. Drag and drop the **Edit Grid** or **Data Grid** component.
5. Drag and drop the drop-downs created at Step 1 into the **Edit Grid** or **Data Grid** component.
6. Open the configuration menu for the child drop-down (click ).
7. In the **Logic** tab, notice the preconfigured advanced logic.

   ![docs image](https://dev-assets.cms.uipath.com/assets/images/activities/activities-docs-image-183297-ab334403.webp)
8. Navigate to the **Actions** &gt; **Schema Definition** field.
9. Replace `[data.<parent_dropdown_key>]` with `[row.<parent_dropdown_key>]` in the schema expression.

   ![docs image](https://dev-assets.cms.uipath.com/assets/images/activities/activities-docs-image-178620-ae1441c0.webp)

   :::note
   The **row** keyword instructs the form to use the parent value from the grid row.
   :::
10. Save the form.

## Setting the number of search results for drop-downs

Drop-downs show at most four search results by default. You can change this limit by setting a property in the form design.

**To set the number of search results for a drop-down**:
1. In the **UiPath Form Designer**, click **Edit** to open settings for the drop-down list and then select the **Data** tab.
2. Under **Choices.js options**, add `{ "searchResultLimit" : x }`, where `x` is the maximum number of results you want to show.

## Displaying all options inside drop-downs

If the strings in the drop-down menu have more than 50 characters, they may be omitted from displaying.

**To display all options matching your search term**:
1. Click **Edit JSON** ![docs image](https://dev-assets.cms.uipath.com/assets/images/activities/activities-docs-image-edit_json_icon_form_component-2086d27c.png) for the **Drop-down List** component you want to edit.
2. In the **Component JSON** field, add the following properties:
   ```
   ...
     "fuseOptions": {
       "distance": 800,
       },
     "threshold": 1,
     "useExactSearch": false,
   ...
   ```

:::note
The `threshold` property dictates at what point the algorithm stops the search operation for the given search term. For example, a `threshold` of `0` requires an exact match of letters and location. A `threshold` of `1` can match anything, even spelling mistakes. Adjust the `threshold` value based on your use case.
:::