Cascade Select Dropdown in AEM Component Dialog | AEM Community Blog Seeding

Avatar

Avatar
Establish
Community Manager
kautuk_sahni
Community Manager

Likes

1,204 likes

Total Posts

6,410 posts

Correct reply

1,147 solutions
Top badges earned
Establish
Coach
Originator
Contributor 2
Contributor
View profile

Avatar
Establish
Community Manager
kautuk_sahni
Community Manager

Likes

1,204 likes

Total Posts

6,410 posts

Correct reply

1,147 solutions
Top badges earned
Establish
Coach
Originator
Contributor 2
Contributor
View profile
kautuk_sahni
Community Manager

23-11-2020

BlogImage.jpg

Cascade Select Dropdown in AEM Component Dialog by jimfrenette

Abstract

Video: https://youtu.be/udidVJ4cn5k

This tutorial demonstrates how to populate CoralUI Select dropdowns in an AEM component dialog from a JSON data source using JavaScript. For added complexity, we’re cascading the dropdowns in multiple instances within a Multifield component.

Getting Started
The code for this tutorial was developed on AEM version 6.5.6.0 which is the latest at the time of this writing. To replicate the project, you can download or clone the source code or create the project using the AEM Project Archetype version 24 Maven template as I have done.

Component Dialog
Rather than create a new component, we’re just going to modify the existing helloworld component that is included with the project.

In the helloworld dialog .content.xml, add the following component nodes after the existing text component node.

1. Heading component (optional)


2. Composite Multifield component











The Multifield needs to be composite to store the cars jcr:content as item nodes.

Read Full Blog

Cascade Select Dropdown in AEM Component Dialog

Q&A

Please use this thread to ask the related questions.