show / hide menu

How can I configure cascading dropdowns?

Cascading Drop downs

The Cascading Drop down Menu allows you to drill down through hierarchical data by using one drop down menu as a filter into the next.

Step 1: Creating AppForm and creating SQL tables.

  • I have configured below form to submit an on line application for the consultancy. When the user selects “Country” from combo box, States should populated in “State” combo box and when the user selects “State” University names should be populated in “University” combo box.
  • After adding controls to the form, I have created below table for country.

  • I have created the table below for States. I have created one more column for saving country IDs.
  • I have crated table below for populating University names in the combo box. I have created one more column for saving state IDs.

Step 2: Configuring combo box with SQL DataSource

  • Click on the combo box called “cmbCountry” and click “New DataSource configuration” from DataSource.
  • DataSource window will be displayed and you can select “MS SQL” as DataSource and click “Ok” button.
  • Select the Database in the next window.

     Note: This DataSource should be created using “DataSource Settings” in the left navigation menu of AppForms. Then only this DataSource name will be displayed in the DataSource wizard.

  • Choose table name and click “Next”.
  • Click “Add” button in the criteria window to add the criteria below.
  • Click “Next” button.
  • Select the value member and display member from DataSource wizard. ID = Value member and Country = Display member.
  • Click “Next” button.
  • Click “Next” in the relation window as we are not going to choose any relationship.
  • Click “Add Trigger” in the miscellaneous window. Before clicking “Add Trigger” if you need to display items in an ascending order, select the column name from “Column” and “Asc” from ascending order and click “Add” button without fail.
  • Choose “FormLoad” as a trigger and click “Create Rule” in the Manage Rule window.
  • Click “Finish” to complete the configuration for “cmbCountry” combo box.
  • You can see that new rule was added with “Formload” as a trigger. You can see this when you click “Rule” tab.
  • Click “Preview”. You can see that country names are populating in combo box.
  • When the user selects “USA” from Country, state names should be populated in the next combo box
  • Configure “cmbState” combo box like how you configured “cmbCountry” up to selecting the table.
  • StateNames.Country = cmbCountry (First combo box for selecting the country).
  • Click “Next” to continue (follow the configuration steps of “cmbCountry” combo box). Select “ID” as Value member and “State” as display member.
  • Add “cmbCountry” as trigger and complete the configuration.
  • When you select “USA” from combo box, you can see that value member = “1” and display member = “USA”.
  • After you selected “USA” from combo box, it will display all the states with value member = “1” in the state combo box. Please compare above “Criteria Builder” figure with below figures of tables for the better understanding.
  • Click “Finish” to complete the configuration for “cmbCountry” combo box.
  • You can see that new rule was added with “Formload” as a trigger. You can see this when you click “Rule” tab.

Click “Preview”. You can see that country names are populating in combo box.

  • When the user selects “USA” from Country, state names should be populated in the next combo box.
  • Configure “cmbState” combo box like how you configured “cmbCountry” up to selecting the table.
  • StateNames.Country = cmbCountry (First combo box for selecting the country).
  • Click “Next” to continue (follow the configuration steps of “cmbCountry” combo box). Select “ID” as Value member and “State” as display member.
  • Add “cmbCountry” as trigger and complete the configuration.
  • When you select “USA” from combo box, you can see that value member = “1” and display member = “USA”.
  • After you selected “USA” from combo box, it will display all the states with value member = “1” in the state combo box. Please compare above “Criteria Builder” figure with below figures of tables for the better understanding.

  • Click “cmbUniversity” and follow above steps that you followed for “cmbCountry” and “cmbState” upto selecting the table.
  • Give a criteria like below.
  • Give “cmbState” as a trigger and complete the configuration.
  • Below figure of tables will explain it clearly.
  • When you select “USA” in the first combobox “Alabama”, “Alaska”, “California”, “New Jersey”, “Connecticut”, “NewYork” and “Virginia” will be displayed in the second combobox . When you select “Alabama” from second combobox “Amridge University” and “Huntingdon College”, “Auburn University” will be displayed.