How to use file.json in drop down datasource to populate dynamic value ? | Community
Skip to main content
Level 2
February 22, 2018
Solved

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

  • February 22, 2018
  • 2 replies
  • 4153 views

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.

This post is no longer active and is closed to new replies. Need help? Start a new post to ask your question.
Best answer by smacdonald2008

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 Select Field

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....

2 replies

smacdonald2008
smacdonald2008Accepted solution
Level 10
February 22, 2018

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 Select Field

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....

hpathanAuthor
Level 2
February 27, 2018

Thanks for sharing approach !