Dynamically populate the value in one dropdown based on other dropdown selection

[vishalv66424037]

Hi Team,

In dialog there are two drop downs, values are coming from backend usingservlet call. Once the author selects the field in dropdown i need to make the call to another servlet based on first drop down selected value and show the options. How to achieve this, i am using classic ui. Please help.

Thanks

[smacdonald2008 · Accepted solution]

As you are working in Classic UI - to perform this use case, you need to write a custom xtype. In the code of the custom xtype, you can invoke the servlet. 

Details here on how to write a custom xtype that shows how to populate a 2nd field based on the 1st selection (in your use case, populate the 2nd with the values returned from the servlet):

Scott's Digital Community: Dynamically updating AEM custom xtype fields

Hope this helps....

[vishalv66424037]

Hi smacdonald2008​,

Thanks for the prompt reply!

My query is still not resolved, i can elaborate my question more:  Based on first drop down selected value i need to pass it as a parameter to the second drop down's servlet and again once the user select the second drop down value there is third drop down which makes a call to third servlet with second drop down selected value as a parameter.

[smacdonald2008]

Its still the same answer - you need to code business logic in the xtype JS file (the custom xtype). Other than using custom JAVAScript logic implemented as a custom xtype - there is no other way to implement this use case.

[smacdonald2008]

Here is an older article that can guide you on how to call a servlet from a custom xtype -- Scott's Digital Community: Invoking Sling Servlets from AEM xtype widgets