Cascade Select and Radio Fields

Cascading select and radio fields allows you to create choices that change based on a previous selection. For example, you could create a vehicle selector using this feature.

In the example below, you can see how the selection of a vehicle make filters the vehicle model options. Likewise selecting a vehicle model filters the vehicle year options.



Select and radio fields are configured using a data grid. Data grids are much like a spreadsheet and allow you to easily manage options for a select field or the radios shown on your form.

The diagram below illustrates how the example above works for the Make and Model fields.

WS Form - Cascading Select and Radio Fields

Cascading works as follows:

  1. Choose a filter value. This can be any select or radio field on your form. In the example above we choose the ‘Make’ radio field as the filter value. This will have the value ‘Toyota’, ‘Ford’ or ‘Honda’.
  2. Choose a filter column. This is the column you want to filter values by. So, if ‘Toyota’ was selected in the ‘Make’ radio field, then this data grid would only show the rows where the ‘Make’ column is equal to ‘Toyota’.
  3. WS Form automatically renders the select field using the filtered options.

You can also daisy chain cascaded select and radio fields as in the example above.

Enabling Cascade

To enable cascading on a field:

  1. Click the settings icon on a select or radio field to open the settings sidebar.
  2. Click the ‘Options’ or ‘Radios’ tab to view the data grid for that field.
  3. Check the ‘Cascade’ checkbox.
  4. Select the ‘Filter Column’. This is the column in your data grid you want to filter.
  5. Select the ‘Filter Value’. This is a select or radio field on your form you want to filter by.
  6. Click ‘Save’.