Cascading Choices (also know as Parent-Child)

Often the answer to one Choices field should populate or filter the options available in a subsequent field.


We call these "cascading choices", where a parent Choice drives one or more child fields.


You can easily add cascading behaviour using the Form Designer.

Our platform is smart enough to handle many levels of cascading choices too - i.e. where one field filters another, which in turn filters another etc.


Note that you must be using a Data Source for your child field(s) in order to add cascading functionality to your Form.

We recommend using Data Sources on all your Choices fields - it is a simpler approach and means that common lists of options such as "Yes/No" can be shared and reused across fields and Forms.


Lets assume we want the following cascading behaviour:


Country field

 -> State field


So when the user chooses a country, then the State field should only show states for that selected country.


Now let's assume the State and City Data Sources are as follows:


Country Code Country Name
AU Australia


US United States


State State Name  Country Code
NSW New South Wales AU
QLD Queensland AU
WA West Australia AU
AL Alabama  US
AK Alaska US
 etc... etc.. etc...

To follow along with this recipe, head to the Data Sources area of the web portal and create two new Data Sources: Country and States.
We have attached two CSV files at the bottom of this article containing the sample data.  
Use the Upload option found on the Data Source -> Rows page to load the CSV data rows into the relevant Data Source.



The steps to implement cascading behaviour using the above example data and setup is as follows:


1. In the Form designer, add a Choices field and name it Country.


2. Select the Country field - this will show the properties for the field on the right hand side.


3. Find the property titled "Answer Choices" and select "Data Source".
    This will show a bunch of options for Data Sources.


4. In the drop-down list of available Data Sources, find the Countries' Data Source and select it.

Sweet!  At this stage, your Country field will now show a list of countries as defined in the Countries data source.
Now let's hook up the State field, along with its cascading filter!
5. Add another Choices field and name it State.
6. Repeat steps 2 - 4 on your State field, but this time round select the States data source.
7. While still on the State field's properties, you should see a "Filter Rows" option, with a "use criteria" link alongside.
    Click this link to add a new filter.
8. You'll now see three fields displayed that let you define how the filter should work.
    What we want to do is have the rows in the States data source be filtered according to the Country Code selected in the Country field.
  • The first filter drop-down shows the columns available on the States data source.
    Choose the "Country Code" option.

  • The second filter drop-down shows the logical operations we can use for filtering.
    Choose the "equals" option.

  • The third field is a text field where you can enter the name of another field or just a static value.
    We want to filter by the Country field's answer, so enter {{Country}} into the text box.
Your handiwork should look like the screenshot below:

Awesome, you're done :)
Now if you save the Form and set it to be in Test mode, you can try it out on your device.
You should see that once you choose a country, the State field is automatically filtered to only show the States rows that have Country Code = the selected country.

(1.01 KB)
(3.76 KB)
  • 0 Users Found This Useful
Was this answer helpful?

Related Articles

Designing Forms

After creating a new Form Screen, you will be taken to the Form Design screen.   Every Form must...

Allowing Users to Jump Pages (Custom Form Navigation)

By default, every Form you create has automatic navigation buttons in the form of arrows that...

Dynamic Titles and Hints

Sometimes you may want your field's Title or Hint text to dynamically include a value from a...

Dynamically Displaying Images from Data Source, Web or Map sources

The "Dynamic Image" property allows you to load images dynamically into Media, Sketch and...

Formula Quick Question/Answer Reference

Below is a list of common scenarios that involve the use of a formula to achieve. This is purely...