web
You’re offline. This is a read only version of the page.
close
Skip to main content

Announcements

Welcome to the Power Platform Communities
News and Announcements icon
Community site session details

Community site session details

Session Id :
Power Platform Community / Forums / Power Pages / Cascading drop-down me...
Power Pages
Suggested Answer

Cascading drop-down menus in a PowePages website?

(1) ShareShare
ReportReport
Posted on by elfreddos 112
I am trying to create a cascading drop-down menus in PowerPages. I know this can be done in a PowerApps model driven form, but this functionality goes away when it's inserted into PowerPages.
 
This functionality would be for instance if I select France as a country, in the City field/ lookup below, I would get all the cities in France.
 
Does anyone even know if this can be done? Apparently nobody has asked this question before, as I am struggling to find a solution.
Categories:
General topics
I have the same question (0)
  • GWham Profile Picture
    GWham 58 Moderator on at
    You would need to rely on JavaScript as there is nothing out the box for that as like PowerApps.
     
    However, you could try to use the WebAPI to get the results and remove/filter them each time you change your first dropdown e.g. country.
     
    I've not tested it, so let me know if you figure it out.
    $(document).ready(function () {
    $("#countryField").change(function () {
        var countryId = $(this).val();

        if (countryId) {
            var query = `/api/data/v9.2/new_cities?$filter=_new_country_value eq ${countryId}`; 
            $.ajax({
                url: query,
                type: "GET",
                headers: {
                    "OData-MaxVersion": "4.0",
                    "OData-Version": "4.0",
                    "Accept": "application/json",
                    "Content-Type": "application/json",
                    "Prefer": "odata.include-annotations=\"*\""
                },
                success: function (data) {
                    var cityDropdown = $("#cityField");
                    cityDropdown.empty();
                    $.each(data.value, function (index, item) {
                        cityDropdown.append(
                            $("<option></option>")
                                .val(item.new_cityid) // City ID
                                .text(item.new_cityname) // City Name
                        );
                    });
                },
                error: function (err) {
                    console.log("Error fetching cities: ", err);
                }
            });
        }
    });
});
    • new_cities is the logical name of your cities entity.
    • _new_country_value is the lookup field that links cities to a country. Adjust this according to your entity schema.
    • new_cityid and new_cityname are placeholders for the actual field names of the city entity in Dataverse. Replace these with the correct logical names.

Under review

Thank you for your reply! To ensure a great experience for everyone, your content is awaiting approval by our Community Managers. Please check back later.

Helpful resources

News and Announcements

Welcome to the Power Platform Communities

Quick Links

Introducing the 2026 Season 1 community Super Users

Congratulations to our 2026 Super Users!

Kudos to our 2025 Community Spotlight Honorees

Congratulations to our 2025 community superstars!

Congratulations to the February Top 10 Community Leaders!

These are the community rock stars!

Leaderboard > Power Pages

#1
Haque Profile Picture

Haque 10

#2
Suriyanarayanan V Profile Picture

Suriyanarayanan V 8

#3
oliver.rodrigues Profile Picture

oliver.rodrigues 5 Most Valuable Professional

Last 30 days Overall leaderboard

Featured topics

Solution to LinkedIn Authentication in Power Apps Portals
Welcome to the Power Pages forum!

Product updates

Microsoft Power Platform Community release plans