InfoPath 2013 Web Browser- Creating Cascading Dropdown Fields with no Code

How many times you require functionality where in based on the selection of parent drop down generates the values to the child drop down.

Examples, selection of Continent fills the Countries drop down.

We can achieve this functionality in INFOPATH Web forms without writing a single line of code.

Before you read on, I must tell you that this approach only works if you have the Enterprise version of SharePoint 2013 or the forms server. You will also need to have InfoPath 2013 Designer installed on your client machine.

Below Example shows 2 dropdowns, the first dropdown contains the Continents and the second dropdown contains the countries of the selected continents.

For the below demo, I have created 2 custom lists in SharePoint.

• Custom List 1
  • Name: Continent
  • Column: Title (Type Single Text, which comes Out of Box with the custom list)
  • Custom List 2
    • Name: Country
    • Column: Title (Type Single Text, which comes Out of Box with the custom list)
    • Column: Continent(Type: Lookup, Get information from:  Continent, Column: Title)

Step1:

Add 2 dropdowns to the form, Let´s name the dropdown´s as Continent and Country, Should look like the below screenshot.

Step2:   Now create 2 data Connections for both the dropdowns.

Creating Receive Data Connection for Continent:  Click on Data Connection

Click on Add

Select create a new Connection

• Receive Data and click Next

Select Source of your Data:

• Select SharePoint Library or List as mentioned in the below screenshot.

Provide URL of the Continent Lists

Select the Continent List

Select Title, Followed by Next, Next and Finish.

Create a similar Receive Data Connection for County, the only difference is instead of selecting only Title, Select Title and Continent Column as well.

Step3:

Assigning above created data connections to the dropdowns

Right click on the Continent dropdown and select the Drop-Down List Box Properties…

Set the properties as shown in the below screenshot.

Similarly Set the properties of the Country Dropdown as shown in the below screenshot.

Now we need to make few adjustments to get the filter of the data when a continent is selected.

In the dropdown properties of the Country, select   of the entries section .

).

Select Filter Data

Click Add

And Select Continent Is Equal to Select a field or group and select the continent from Main

Click on OK. Close all the popups by clicking ok on all popups.

Give full trust to the form and click F5 to see the demo

You will observer you have a cascading dropdown functionality in the INFOPATH forms without writing a single line of code.

Example

      

There is one tiny issue! The country drop down does not clear itself. Therefore if you pick another continent, the old country will stay the same as the one you had picked in the earlier pick of the city.

Step 4:

Select the Continent dropdown and select the Manage Rule 

            Click on New and select Action

Select the Set the Field Value as shown in the below screenshot.

Set a field’s value, and then pick Country for the field. Leave the Value blank.

Click on Ok.

Hit OK , and you are done!