Expand my Community achievements bar.

Don’t miss the AEM Skill Exchange in SF on Nov 14—hear from industry leaders, learn best practices, and enhance your AEM strategy with practical tips.
SOLVED

How to use file.json in drop down datasource to populate dynamic value ?

Avatar

Level 2

I am using AEM 6.3 SP1 and creating a touch ui dialog using coral ui 3.

Dialog has drop-down. I want to populate the drop down options from resource e.g. file.json. where options are stored as a string json key-value pare.

1 Accepted Solution

Avatar

Correct answer by
Level 10

To do this - you need to use a WCMUSEPOJO class and read the JSON file using Java app logic.

Then you need to set a DataSource object and put the JSON values into this Object. That way - the DataSource object is populated with JSON data and will populate a drop-down (Select field).

See this article to learn how to use a DataSource Object to populate a Select field in a Touch UI dialog.

Adobe Experience Manager Help | Using an WCMUsePojo class to populate an Experience Manager Touch UI...

This is how you can dynamically populate a Select field or use other data types like XML or JSON. Parse the JSON and populate the DataSource object - which will then be displayed in the Select field.

As shown in the article - you can use a Map object to define the values. After you parse the values from the JSON data, place them into the MAP.

final Map<String, String> countries = new LinkedHashMap<String, String>();

countries.put("in", "India");

countries.put("us", "United States");

countries.put("aus", "Australia");

countries.put("pak", "Pakistan");

countries.put("sri", "Srilanka");

Hope this helps....

View solution in original post

2 Replies

Avatar

Correct answer by
Level 10

To do this - you need to use a WCMUSEPOJO class and read the JSON file using Java app logic.

Then you need to set a DataSource object and put the JSON values into this Object. That way - the DataSource object is populated with JSON data and will populate a drop-down (Select field).

See this article to learn how to use a DataSource Object to populate a Select field in a Touch UI dialog.

Adobe Experience Manager Help | Using an WCMUsePojo class to populate an Experience Manager Touch UI...

This is how you can dynamically populate a Select field or use other data types like XML or JSON. Parse the JSON and populate the DataSource object - which will then be displayed in the Select field.

As shown in the article - you can use a Map object to define the values. After you parse the values from the JSON data, place them into the MAP.

final Map<String, String> countries = new LinkedHashMap<String, String>();

countries.put("in", "India");

countries.put("us", "United States");

countries.put("aus", "Australia");

countries.put("pak", "Pakistan");

countries.put("sri", "Srilanka");

Hope this helps....

Avatar

Level 2

Thanks for sharing approach !