Skip to main content
All CollectionsHelp ArticlesApricot Data EntryBuilding Forms
How do I create cascading dropdowns in a form?
How do I create cascading dropdowns in a form?
Updated today

A cascading dropdown is a type of form field where the options available in one dropdown are dynamically determined by the selection made in a previous dropdown.

For example, imagine you have a form with two dropdowns - one for "Program Referring To" and one for "Service Needed". The options in the "Service Needed" dropdown should change depending on the services provided by the program the participant is being referred to.

Follow the steps below to learn how to use form logic and Lookup Lists to create cascading dropdowns in an Apricot form.

Step 1: Create Lookup Lists

A Lookup List is a collection of options that can be applied to various option-based fields, such as dropdowns, radio buttons, and checkboxes. To learn more about Lookup Lists, click here.

In the Administrator tab, expand the Form Designer category of the navigation bar and open the Lookup Lists page.

Select "+ Create New Category" from the Lookup List Actions palette, then choose which category you want the list to fall under on this page. Name the list something easily identifiable when selecting which Lookup List to use in your forms, then click "+ Create".

For our example, we'll create a list of all the programs in our organization.

Type in the display values for each option you want to include. You can enter them one at a time, or select "Enable Bulk Entry" from the Lookup List Actions palette to copy and paste multiple options at once.

Select "Save Lookup List" at the top-right of the page, then return to the Lookup Lists page.

Repeat this step to create as many lists as necessary for the cascading dropdowns you're looking to add to your form. For our example, we would create a list of all the services provided in a single program and repeat this for each program in the organization.

Step 2: Add form fields

Open the form you want to work with in the Form Designer, then drag and drop at least two Dropdown fields from the Field Choices palette into your form. We've added one "Program Referring To" dropdown and one "Service(s) Needed" dropdown.

Click the gear icon next to the first dropdown field to open its properties. Then, check the "Use Lookup List" box and select which list to populate the field's options from. Click "Apply" to save your changes.

Step 3: Create a form rule

Open the Form Properties by clicking the top-most gear icon on the page, then check the "Enable Form Logic" box under Settings. Form logic uses conditional rules to change the behavior of the form depending on the data entered into other fields. To learn more about form logic, click here.

Click "Apply" to close the window, then scroll down to the Form Rules section at the bottom of the page.

Click "New Rule" to open the Rule Properties window, then add a name and description that identifies what action will be performed once the criteria is met.

Our example will use the "[Program A] Services Provided" Lookup List to populate the options for the "Service(s) Needed" dropdown field if a user selects [Program A] in the "Program Referring To" field.

The "Show on Palette" checkbox determines whether the rule name is visible to users when filling out a record. Select "Apply" to save your changes.

Click on the rule name to expand its section, then add a new Condition and Action based on the rule you're looking to create. Select the fields you added in Step 2, the values for the fields that should trigger the action, and the Lookup Lists you created in Step 1 in the appropriate dropdowns.

For our example, we would create a new rule for each possible program that could be selected in the "Program Referring To" field in order to populate the "Service(s) Needed" field with its corresponding Lookup List.

Step 4: Save your changes

Select "Publish" from the Form Actions palette to apply your form logic and make it available for data entry.

When recording our form for a participant, you'll see that the "Service(s) Needed" field does not display any options until a program is selected in the prior dropdown.

Rather than listing every service provided across all programs for a user to scroll through and select, the field only populates the options relevant to the value selected in the previous field.

What else do you need help with?

Did this answer your question?