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

data-sly-list iteration for a JsonArray

Avatar

Level 2
 
 

Hi AEM Gurus,

 

I have a JSON Array like below sample

 

 

{
"sites": {
"label": "Parent LABEL",
"mobileLabel": "Parent Mobile Label",
"items": [
{
"href": "www.google.com",
"id": "goog",
"label": "Google Search"
},
{
"href": "www.yahoo.com",
"id": "yah",
"label": "yahoo site"
},
{
"href": "www.wikipedia.com",
"id": "wiki",
"label": "wikipedia"
}
]
}
}

Now i am trying to Iterate and get the values from this JSON array using data-sly-list something like as shown in below structure

<ul data-sly-list.key="${model.jsonarray}">
<li><a  href="${key.href}">${key.label} - ${key.id}</a></li>
</ul>

I know we can iterate Arraylist or a Map object but how do I iterate a JSON array. Please suggest.

 

Regards,

Rajashankar.R

 

 

 

1 Accepted Solution

Avatar

Correct answer by
Community Advisor

You would need to serialize the JSON string to either a List<HashMap> or List<Link>. Once you return a valid List object to your slightly business logic, your code should work as expected. 

However, if your list looks something like List<Json> then that would also work as well. You ultimately just need to have a valid List object with valid item objects.

View solution in original post

14 Replies

Avatar

Correct answer by
Community Advisor

You would need to serialize the JSON string to either a List<HashMap> or List<Link>. Once you return a valid List object to your slightly business logic, your code should work as expected. 

However, if your list looks something like List<Json> then that would also work as well. You ultimately just need to have a valid List object with valid item objects.

Avatar

Community Advisor

Hi @rajaram33,

 

You can use the below code, convert JSONArray to List and pass it to sightly.

 

ArrayList<String> listdata = new ArrayList<String>();
if (jArray != null) {
for (int i=0;i<jArray.length();i++){
listdata.add(jArray.getString(i));
}
}

 

Hope this helps.

 

Thanks,

Kiran Vedantam.

Avatar

Level 2
Let me try both options and get back soon please do not close this as resolved

Avatar

Level 2
I tried adding Json Array to array list but when i try to access it in htl like this <div class="cmp-helloworld__item" data-sly-use.model="com.demoapp.core.models.FooterModel"> <ul data-sly-list.child="${model.demoItem}"> <li > ${child.label} Value: ${child.href}</li> </ul> </div>

Avatar

Level 2
Kiran please suggest how to parse the list in this case in htl which has the json array populated at model.I am struglling at htl to get the value

Avatar

Level 2
 

Hi @BrianKasingli @Kiran_Vedantam ,

I tried as suggested by creating a Link with hashmap

 

 

public List<HashMap<String, String>> getListItem(JSONObject taxanomyDat) {
log.info("Inside Model getDemoItem");

List<HashMap<String, String>> prodArrayList = new ArrayList<HashMap<String, String>>();

Map<String, String> siteLink = new LinkedHashMap<String, String>();

siteLink.put("label1", "www.gmail.com");
siteLink.put("label2", "www.yahoo.com");
prodArrayList.add((HashMap<String, String>) siteLink);

return prodArrayList;
}

public List<HashMap<String, String>> getDemoItem() {
return demoItem;
}

 

 

And in HTL i am not sure What mistake i am doing or how to get the key and value inside haspmap of arraylist.

 

 

<div class="cmp-helloworld__item" data-sly-use.model="com.myapp.core.models.SampleModel">
<p class="cmp-helloworld__item-label">Model message:</p>
<ul data-sly-list="${model.demoItem}">
<li >${item.siteLink}</li>
</ul>
</div>

 

 

 

 

 

 

 

 

 

 

Avatar

Level 1

Hi AEM Gurus,

 

I have a JSON Array like below sample

 

 

{
"sites": {
"label": "Parent LABEL",
"mobileLabel": "Parent Mobile Label",
"items": [
{
"href": "profile bio ",
"id": "goog",
"label": "Google Search"
},
{
"href": "profile bio /",
"id": "yah",
"label": "yahoo site"
},
{
"href": "www.wikipedia.com",
"id": "wiki",
"label": "wikipedia"
}
]
}
}

Now i am trying to Iterate and get the values from this JSON array using data-sly-list something like as shown in below structure

<ul data-sly-list.key="${model.jsonarray}">
<li><a  href="${key.href}">${key.label} - ${key.id}</a></li>
</ul>

I know we can iterate Arraylist or a Map object but how do I iterate a JSON array. Please suggest.

 

Regards,

Rajashankar.R

Avatar

Level 1

Hi AEM Gurus,

 

I have a JSON Array like below sample

 

 

{
"sites": {
"label": "Parent LABEL",
"mobileLabel": "Parent Mobile Label",
"items": [
{
"href": "picpalace ",
"id": "goog",
"label": "Google Search"
},
{
"href": "picpalace",
"id": "yah",
"label": "yahoo site"
},
{
"href": "www.wikipedia.com",
"id": "wiki",
"label": "wikipedia"
}
]
}
}

Now i am trying to Iterate and get the values from this JSON array using data-sly-list something like as shown in below structure

<ul data-sly-list.key="${model.jsonarray}">
<li><a  href="${key.href}">${key.label} - ${key.id}</a></li>
</ul>

Our collection of good morning monday images has the ideal visual to meet all your needs – from inspiring quotes and humorous quips to relaxing images

I know we can iterate Arraylist or a Map object but how do I iterate a JSON array. Please suggest.

 

Regards,

Rajashankar.R

Avatar

Level 1


"href": "godimagesdownload",

"href": "godimagesdownload",
ction of Waheguru Good Morning Images  has the ideal visual to meet all your needs – from inspiring quotes and humorous quips to relaxing images

 

Avatar

Level 1

Our collection of good morning monday images has the ideal visual to meet all your needs – from inspiring quotes and humorous quips to relaxing images

Avatar

Level 1

I have a JSON Array like below sample

 

 

{
"sites": {
"label": "Parent LABEL",
"mobileLabel": "Parent Mobile Label",
"items": [
{
"href": "www.google.com",
"id": "goog",
"label": "Google Search"
},
{
"href": "www.yahoo.com",
"id": "yah",
"label": "yahoo site"
},
{
"href": "www.wikipedia.com",
"id": "wiki",
"label": "wikipedia"
}
]
}
}

Now i am trying to Iterate and get the values from this JSON array using data-sly-list something like as shown in below structure

<ul data-sly-list.key="${model.jsonarray}">

Our collection of good morning monday images has the ideal visual to meet all your needs – from inspiring quotes and humorous quips to relaxing images

Avatar

Level 1

Staffing Solutions

 

download.jpg

 

At MNR Solutions, we focus on delivering competency-based and quality staffing solutions driven by dynamic business needs across the multi-industry sectors. From timely temporary staffing on quick projects to permanent staffing for long-term organizational success and executive staffing for strategic firms, our staffing services will provide you with all the staffing solutions you require.