Skip to content

cascading-dropdown-component migration #291

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
Laskewitz merged 2 commits into from
Aug 6, 2025
Merged

cascading-dropdown-component migration #291

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
8204d51
cascading-dropdown-component migration
jan-chlebek Jul 15, 2025
1690505
Update README.md
jan-chlebek Jul 15, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
105 changes: 1 addition & 104 deletions samples/cascading-dropdown-component/README.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,106 +1,3 @@
---
page_type: sample
languages:
- powerapps-comma
products:
- powerapps
- canvas
- sharepoint
name: Cascading Dropdown Component
description: Demonstrates how to create a custom control that can handle a two-level cascading dropdown picker
urlFragment: cascading-dropdown-component
ms.date: 10/29/2022
author: aprildunnam
ms.author: pnp
level: beginner
ms.prod: power-apps
---

# Cascading Dropdown Component

## Summary

This is a Power Apps Canvas component that demonstrates how to implement a custom cascading dropdown control. This control handles a two-level cascading dropdown and can even be customized to handle a single selection or multiple selection of items.

![Preview](./assets/preview.png)

## Features

This sample app is a great way to learn some fundamental Power Apps concepts like:

* How to build a component and use component input and output properties
* How to show/hide elements
* How to leverage collections and split out collection items into a string

## Applies to

* [Microsoft Power Apps](https://docs.microsoft.com/powerapps/)
* [Microsoft Power Automate](https://docs.microsoft.com/en-us/power-automate/)

## Compatibility

![Power Apps Source File Pack and Unpack Utility 0.20](https://img.shields.io/badge/Packing%20Tool-0.20-green.svg)
![Premium License](https://img.shields.io/badge/Premium%20License-Not%20Required-green.svg "Premium Power Apps license not required")
![Experimental Features](https://img.shields.io/badge/Experimental%20Features-No-green.svg "Does not rely on experimental features")
![On-Premises Connectors](https://img.shields.io/badge/On--Premises%20Connectors-No-green.svg "Does not use on-premise connectors")
![Custom Connectors](https://img.shields.io/badge/Custom%20Connectors-Not%20Required-green.svg "Does not use custom connectors")

## Authors

Solution|Author(s)
--------|---------
Cascading Dropdown Component | [April Dunnam](https://github.com/aprildunnam) ([@aprildunnam](https://www.twitter.com/aprildunnam) )

## Version history

Version|Date|Comments
-------|----|--------
1.0|Oct 29, 2022|Initial release
## Prerequisites

### Using the component

To use the component in this sample, you'll need to either hard code in the items you want to display in the 1st level and 2nd level menus or pull them in from your data source. The cascading effect is dependent on having a property in your 1st level items called "Name" and a property inyour 2nd level items called "ParentItem" which can be matched back to the name field of the 1st level items. Look at the default 1stLevelItems and 2ndLevelItems properties to see the format that the component is expecting.

## Data Sources

None

## Minimal Path to Awesome

* [Download](./solution/CascadingDropdown.msapp) the `.msapp` from the `solution` folder
* Use the `.msapp` file using **File** > **Open** > **Browse** within Power Apps Studio.
* Save and Publish

## Using the Source Code

You can also use the [Power Apps CLI](https://docs.microsoft.com/powerapps/developer/data-platform/powerapps-cli) to pack the source code by following these steps::

* Clone the repository to a local drive
* Pack the source files back into `.msapp` file:
```bash
pac canvas pack --sources pathtosourcefolder --msapp pathtomsapp
```
Making sure to replace `pathtosourcefolder` to point to the path to this sample's `sourcecode` folder, and `pathtomsapp` to point to the path of this solution's `.msapp` file (located under the `solution` folder)
* Use the `.msapp` file using **File** > **Open** > **Browse** in Power Apps Studio.

## Disclaimer

**THIS CODE IS PROVIDED *AS IS* WITHOUT WARRANTY OF ANY KIND, EITHER EXPRESS OR IMPLIED, INCLUDING ANY IMPLIED WARRANTIES OF FITNESS FOR A PARTICULAR PURPOSE, MERCHANTABILITY, OR NON-INFRINGEMENT.**


## Support

While we don't support samples, if you encounter any issues while using this sample, you can [create a new issue](https://github.com/pnp/powerapps-samples/issues/new?assignees=&labels=Needs%3A+Triage+%3Amag%3A%2Ctype%3Abug-suspected&template=bug-report.yml&sample=calendar-component&authors=@aprildunnam&title=calendar-component%20-%20).

For questions regarding this sample, [create a new question](https://github.com/pnp/powerapps-samples/issues/new?assignees=&labels=Needs%3A+Triage+%3Amag%3A%2Ctype%3Abug-suspected&template=question.yml&sample=calendar-component&authors=@aprildunnam&title=calendar-component%20-%20).

Finally, if you have an idea for improvement, [make a suggestion](https://github.com/pnp/powerapps-samples/issues/new?assignees=&labels=Needs%3A+Triage+%3Amag%3A%2Ctype%3Abug-suspected&template=suggestion.yml&sample=calendar-component&authors=@aprildunnam&title=calendar-component%20-%20).

## For more information

- [Create a component for canvas apps](https://docs.microsoft.com/powerapps/maker/canvas-apps/create-component#components-in-canvas-apps)
- [Overview of creating apps in Power Apps](https://docs.microsoft.com/powerapps/maker/)
- [Power Apps canvas apps documentation](https://docs.microsoft.com/en-us/powerapps/maker/canvas-apps/)

<img src="https://telemetry.sharepointpnp.com/powerapps-samples/samples/calendar-component" />
This sample has been moved to [here](https://github.com/pnp/powerplatform-samples/tree/main/samples/cascading-dropdown-component).
Binary file removed samples/cascading-dropdown-component/assets/preview.png
View file
Open in desktop
Binary file not shown.
92 changes: 0 additions & 92 deletions samples/cascading-dropdown-component/assets/sample.json
View file
Open in desktop

This file was deleted.

Binary file removed samples/cascading-dropdown-component/solution/CascadingDropdown.msapp
View file
Open in desktop
Binary file not shown.
12 changes: 0 additions & 12 deletions samples/cascading-dropdown-component/source/Assets/SampleImage.json
View file
Open in desktop

This file was deleted.

Binary file removed samples/cascading-dropdown-component/source/Assets/logo.jpg
View file
Open in desktop
Binary file not shown.
115 changes: 0 additions & 115 deletions samples/cascading-dropdown-component/source/CanvasManifest.json
View file
Open in desktop

This file was deleted.

1 change: 0 additions & 1 deletion samples/cascading-dropdown-component/source/ComponentReferences.json
View file
Open in desktop

This file was deleted.

1 change: 0 additions & 1 deletion samples/cascading-dropdown-component/source/Connections/Connections.json
View file
Open in desktop

This file was deleted.

Loading