Expand my Community achievements bar.

Enhance your AEM Assets & Boost Your Development: [AEM Gems | June 19, 2024] Improving the Developer Experience with New APIs and Events

How to: Dynamic Population based on multiple drop-downs


Level 1

Here is what I am working on. I'm very new to LC, so I appreciate any guidance.

For context, I am building a form that will be used across a very large educational organization. In this form, users will select:

First, the region they are based in (there are 20 different regions they can select from in a dropdown list)

Second, the school district they are based in. There are about 1,000 school districts between the 20 regions. I want only the districts from their selected region to be available in the dropdown list.

Third, the school campus they are based in. There are about 3,600 individual schools between all the school districts. I want only the school campuses in their selected school district to populate in the dropdown list.

Based on the school district they select, and the school campus they select -- I also want the unique ID for the district and campus to auto-populate in separate, uneditable text fields.

Is this possible? If so, can you provide some guidance? I have all the necessary data in a spreadsheet. I have looked into linking the data, but I want to be sure I know more about what to do before I move forward.


1 Reply


Level 10

Hi there,

there is many ways to work this out...

One way to do it, which is how I proceed to link list of items to specified items, would be using JSON objects,

by creating JSON Objects, you can easily link a list of items to 1 item, creating properties and functions within those objects to manipulate data easily.

Here is and example :

Now by accessing oneRegionSchool, once you have found the region corresponding to the selected region, you can access the array of all schools within... I suggested using JSON Objects instead of arrays because it is easier to see what properties you are working with instead of using indexes, and also it is easier to use function within the objects to extract the value you want.

By creating the object this does not save all the values in a globable variable, this only create a temporary JSON Object. You can create an aside JSON Object to save all the values you have created with the following :

I hope this will lead you the right way, this is how I manage to work around with thousands of data linked with each other. And it is very convenient to modify when a modification is needed because the properties are easier to manipulate than arrays.