Power Apps Cascading Dropdown Control

In Power apps, the cascading dropdowns are a set of dropdowns in a hierarchy that show values based on the previous selection. When well-designed, they assist app users in quickly navigating an otherwise overwhelming set of options.

In this article, we will demonstrate how to create a cascading dropdown in Power Apps based on different scenarios. such as:

• PowerApps cascading dropdown
• PowerApps dropdown depends on
• PowerApps cascading dropdown SharePoint lookup column
• PowerApps cascading dropdown sort
• PowerApps cascading dropdown distinct
• PowerApps cascading dropdown defaults to blank
• PowerApps cascading dropdown choice column
• PowerApps cascading dropdown Reset
• powerapps cascading dropdown person field
• PowerApps cascading dropdown multi-select
• PowerApps cascading dropdown excel

What is Power Apps cascading dropdown

In Power Apps, the cascading dropdown means one dropdown selected value depends on another dropdown value. When an item is selected on a Power Apps dropdown control, the respective values will be displayed in another dropdown.

In this Power Apps tutorial, we will see how to work with cascading dropdowns within the Power Apps with various real-time examples.

Power Apps dropdown depends on

Here we will see how to work with the Power Apps dropdown ‘depends on‘. When a user selects an option from one dropdown control, the values are filtered into another dropdown control in Power apps.

To work with this, we have prepared a SharePoint list named ‘IT Sectors’ having single-line columns such as Sectors and Country with some random data like below:

Using the above SharePoint list, we will create 2 dropdown controls. From this, when the user selects any country name from the dropdown control, then the respective sectors will display in the other dropdown control. To work with this, the following steps are:

• Next, sign in to the Power Apps with your Office365 user ID, and connect the above SharePoint list to the app. so that we can use the list as a source.
• On the Power Apps default screen, add a dropdown control and insert the below expression into the dropdown’s Items property. As a result, it will display the unique value of the ‘Sector’ column.

Items = Distinct('IT Sectors',Sector)

• Again, add another dropdown control to that screen.
• On the right side properties panel, set the Items as SharePoint list i.e., IT Sector.

• Also, set the ‘Value’ as Country.
• Next, go to the ‘Depends On’ on the properties panel. Set the parent control as DD_Sector, and Result. Similarly, set the matching field as IT Sector, and Sector. Then click on Apply.
• We can see the second dropdown’s Items property will come up with the below expression automatically.

Items = Filter('IT Sectors', Sector = DD_Sector.Selected.Result)

Where DD_Sector is the name of the first dropdown control.

Let’s test this app. Save and publish the app for now. Then play it in preview mode. Select any item from the sector dropdown. We can see the respective items will be displayed in the country dropdown. (Ex- Microsoft).

This is how to work with the PowerApps Dropdown ‘depends on’ another dropdown.

Power Apps cascading dropdown sort

Here we will see how to Power Apps cascading dropdown sort. That means we will sort the Power Apps cascading dropdown items in ascending or descending order.

To work with this requirement, we are going to use the above Power Apps dropdown control that displays the respective countries based on the selected dropdown items.

On the above drop-down, we can see when the user selects Microsoft, the respective items are not displaying in an orderly form. Now, we will sort the country dropdown into ascending or descending order. Suppose, we want to sort it in ascending order.

To do this, insert the below expression on the country dropdown’s items property.

Items = SortByColumns(Filter('IT Sectors', Sector = DD_Sector.Selected.Result),"Country",Ascending)

Let’s save, and publish the app. Then select an item from the sector dropdown and we can see the items will come in ascending order in the country dropdown like below:

This is how to sort the Power Apps cascading dropdown control.

Also Read: How to Filter Power Apps Dropdown Control

Power Apps cascading dropdown SharePoint lookup list

Here, we will see how to work with PowerApps cascading dropdown SharePoint lookup list. That means there are two drop-down controls on the Power Apps that use the SharePoint list as a source, including lookup values.

When the user selects any item from the first dropdown, the respective items will display on another dropdown. If this is the requirement, then we can refer to this article that covers how to create a Power Apps cascading dropdown using the SharePoint lookup list.

Power Apps cascading dropdown distinct

Here, we will see how to work with Power Apps cascading dropdown distinct. We are going to use the above example of Power Apps dropdown control where the respective countries are displaying based on another dropdown selective item.

Suppose, we have selected the sector as Google but it is displaying the countries including repetitive items like below:

But as per our requirement, we want to display only distinct values or unique values on the Power Apps cascading dropdown control. To show the unique values and remove the duplicate values, we need to use the distinct() on the cascading dropdown’s Items property (i.e., Country dropdown).

Items = Distinct(Filter('IT Sectors', Sector = DD_Sector.Selected.Result),Country)

Let’s save and publish the app for now. Then play the app in preview mode and we can see when we select the item as Google, it will display only the respective distinct values within the country dropdown.

This is how to create a distinct cascading dropdown on the Power Apps.

Check out: How to Work With Power Apps Dropdown Blank Values

Power Apps cascading dropdown default to blank

We discovered that the Power Apps dropdown control displays the first item by default while working with it. It can be odd at times. Alternatively, we could leave the dropdown empty and let the user choose the item based on their needs.

Here we will see how to work with Power Apps cascading dropdown default to blank. That means when the user opens the Power Apps screen, instead of the first item it will display a blank value on the Power Apps cascading dropdown list.

There is a property called ‘AllowEmptySelection‘ in the Power Apps dropdown that allows the user to select the empty item or clear the selection within the Power Apps dropdowns as well. If no item is selected, the control displays an empty selection.

Let’s implement this property to our Power Apps cascading dropdown so that it will display a blank value as default. We are going to use the above example of Power Apps dropdown control.

Select the ‘Sector’ dropdown and set the ‘AllowEmptySelection‘ as true. Do repeat this on the ‘Country’ cascading dropdown.

AllowEmptySelection = true

Let’s save, publish and close the app for now. When we reopen the app, we can see that both the Power Apps cascading dropdowns are set to a blank value by default shown as below.

This is how to set the default to blank on Power Apps cascading dropdown control.

Also read: How to Remove Duplicates in Power Apps Dropdown

Power Apps cascading dropdown choice column

Here, we will see how to work with PowerApps’ cascading dropdown choice column. When the user selects any choice from the dropdown control, it will display the respective items on another dropdown control.

To work with this requirement, we have prepared a SharePoint list named ‘Job Openings’ that contains two choice columns, such as Designation and JobLocation.

To implement our above requirement, the following steps are:

• On the Power Apps screen, add a dropdown control and insert the below expression on the Items property to display the choices of the above Designation column.

Items = Choices('Job Openings'.Designation)

Where “Job Openings” is the name of the SharePoint list and “Designation” is the name of the SharePoint choice column.

• Next, add another dropdown control to the screen and insert the below expression on the dropdown’s Items property.

Items = Filter(Choices('Job Openings'.JobLocation),Value in Filter(AddColumns('Job Openings',"Location",JobLocation.Value), Designation.Value=DD_Designation.Selected.Value).Location)

Where,

1. JobLocation.Value, Designation.Value: The name of the SharePoint choice columns.
2. DD_Designation: The name of the first dropdown control.
3. Location: The name of the new column.

Let’s save, publish, and play the app in preview mode. When we select any choice from the designation dropdown, the respective data will display on the job location dropdown.

Suppose, we will select the designation as Azure TechLead and the job location will come like below:

This is how to build a PowerApps cascading dropdown with multiple SharePoint choice columns.

Check out: How to Set Default Value in Power Apps Dropdown

Power Apps cascading dropdown Reset

Here, we will see how to work with PowerApps’ cascading dropdown reset. That means when the user clicks on a reset button, the preselected items will reset and display a blank value, allowing the user to select the item as per their requirement.

To achieve this need, we are going to use the above Power Apps cascading dropdowns. Select the designation dropdown and set the ‘AllowEmptySelection’ as true.

Next, we will add a button control to the above Power Apps screen, and rename it as Reset. Also, insert the below expression in the button’s OnSelect property.

OnSelect = Reset(DD_Designation); Reset(DD_JobLocation)

Where DD_Designation and DD_JobLocation are the names of the dropdown controls.

Let’s play this app in preview mode to see how it works. Before that save, and publish the app. Then click on the Reset button and we can see it will reset the dropdowns as well as vanish the selected item from the designation dropdown. As a result, the dropdowns are coming like below:

In addition, instead of using button control, we can place the above reset() expressions within the Screen’s OnVisible property. As a result, the cascading dropdowns will be reset each time that screen is displayed.

This is how to reset Power Apps cascading dropdown controls.

Read: How to use Power Apps Gallery Dropdown

Power Apps cascading dropdown person field

Here we will see how to work with the Power Apps cascading dropdown person field. That means when the user selects any person’s name from the people dropdown then the respective item will display in another dropdown control.

Suppose, we have a SharePoint list named Projects that contains a single line text column and a person field column i.e., Project Title and HandleBy having some random data.

On the Power Apps screen, we will build a dropdown control that will display the person field. So insert the below expression on the dropdown Items property.

Items = Distinct(Projects, HandleBy.DisplayName)

• Next, we will add another dropdown that will display the respective project’s titles based on the first dropdown’s selected name(i.e., handleby dropdown). Select the second dropdown and insert the below code in the dropdown’s Items property.

Items = Filter(Projects, HandleBy.DisplayName = DD_HandleBy.Selected.Result).'Project Title'

Let’s save the app and publish it. Play the app in preview mode. While we select any person’s name(ex- Sonam Subhadarsini), we can see the respective projects will be represented as below:

This is how to create a cascading dropdown control using People Picker in Power Apps.

Power Apps cascading dropdown multi-select

Do you want to work with the Power Apps cascading dropdown multi-select? This means while working with Power Apps’ cascading dropdown, that allows the user to select multiple items. But unfortunately, Power Apps does not support multi-select cascading dropdowns.

Microsoft provides some limitations while working with cascading dropdowns within the Power Apps. Please click on the link to get ideas.

There is another Power Apps control named the Combo Box that allows the user to multi-select items at the same time. So we recommend you use combo box control instead of dropdown control.

Suppose, we are going to use the above example to show how the combo box works. Here, we will take a combo box control and insert the same expression that we have used in the second dropdown’s Items property.

And, we can see it allows us to select multiple items like below:

This is how we can select multiple items using a PowerApps cascading Combobox instead of dropdown control.

Read: Power Apps Dropdown Control with SharePoint

Power Apps cascading dropdown excel

Here we will see how to work with PowerApps” cascading dropdown based on excel data. Suppose, we have an excel spreadsheet named Vehicle Data that contains 2 columns such as Vehicle and Country. Also, we have formatted the below excel data to table format.

Next, we will connect this excel table to the Power Apps. So that we can use this sheet as our source. To connect this excel to the Power Apps, the steps are:

• On the Power Apps screen, go to Data > +Add Data.
• Search Excel on the search bar.
• Select Excel Online(Business).

• Choose the data set and connect. We can find the excel sheet on the Power Apps environment below:

Next, on the Power Apps screen, add a dropdown control and insert the below expression on the ‘Items‘ property to display the country’s unique value.

Items = Distinct(VehiclesTable,Country)

Again add another dropdown control to the above screen and insert the below expression on the ‘Items‘ property to display the corresponding items(Vehicles) based on the selected country.

Items = Filter(VehiclesTable,Country = DD_Country.Selected.Result)

Where DD_Country is the name of the country dropdown control.

Let’s save the app and publish it. To test the app, play in preview mode. We can see when we will select any country from the first dropdown (ex- UK), the second dropdown will display the respective vehicles like below:

This is how to create cascading dropdowns within the Power Apps.

Also, you may like the below Power Apps Tutorials:

• How to use Power Apps Combo Box Control?
• How to Sort Combo Box Items in Power Apps
• How to Reset Power Apps Combo Box
• Power Apps Gallery Group By [With Real Examples]
• Power Apps Gallery Patch [With Various Examples]
• Power Apps Gallery SharePoint [With 15+ Examples]
• Power Apps Gallery Control [Complete Tutorial]

Conclusion

In this Power Apps Tutorial, we learned all about what a cascading dropdown is in Power Apps. We have also discussed how to build cascading dropdowns based on different scenarios. such as:

• PowerApps dropdown depends on
• PowerApps cascading dropdown SharePoint lookup column
• PowerApps cascading dropdown sort
• PowerApps cascading dropdown distinct
• PowerApps cascading dropdown default to blank
• PowerApps cascading dropdown choice column
• PowerApps cascading dropdown Reset
• PowerApps cascading dropdown person field
• PowerApps cascading dropdown multi-select
• PowerApps cascading dropdown excel