Populate Touch UI dropdown dynamically from sling servlet response.




I'm trying to populate a select dropdown in the page properties for experience fragments with the JSON response returned by a sling servlet.

In my page properties, I have two dropdowns: brand and author. Brand is populated via datasource using acs-commons generic lists. The author dropdown needs to fetch authors from an external service based on the brand selected and get populated with all the authors for that brand. I have a sling servlet (/services/users/get?brand=<brand>) that fetches the users/authors as a JSON Array. JSON Objects have name and ID properties that need to map to text and value within AEM for each dropdown selection. If the brand value is changed in the dialog, the author field should fetch the users for the current selected brand.

What's the best approach for something like this? Should I be relying purely on dialog listeners or create a datasource using the response from the servlet?