Expand my Community achievements bar.

Dive into Adobe Summit 2024! Explore curated list of AEM sessions & labs, register, connect with experts, ask questions, engage, and share insights. Don't miss the excitement.
SOLVED

Unable to iterate paragraph object in Sightly

Avatar

Level 4

I am trying to iterate a list of paragraphs(com.day.cq.wcm.foundation.Paragraph) using JAVA USE API and Sightly. However it displays an empty list in the front end.

Below is the code:

Java:

public class AnchorList extends WCMUsePojo{ private List<Paragraph> paragraphs; public List<Paragraph> getParagraphs() { return paragraphs; } public void setParagraphs(List<Paragraph> paragraphs) { this.paragraphs = paragraphs; } public void activate() throws Exception{ paragraphs = new LinkedList<Paragraph>(); Resource resource = getResource(); SlingHttpServletRequest slingRequest = getRequest(); ParagraphSystem parSys = ParagraphSystem.create(resource, slingRequest); for (Paragraph par: parSys.paragraphs()) { paragraphs.add(par); } } }
HTML:<div data-sly-use.anchorList="AnchorList" data-sly-unwrap> <div data-sly-list.paragraphs="${anchorList.paragraphs}" data-sly-unwrap> Para Type is: ${paragraphs.getType} </div> </div>

 

I am trying to get the type of paragraph from the foundation paragraph class. But its able to identify the size and iterating 'n' times but its not able to display the value.

Note: Paragraph is not a custom class, its the cq foundation class i.e. com.day.cq.wcm.foundation.Paragraph;

1 Accepted Solution

Avatar

Correct answer by
Level 10

I got it working - i changed the way Resource was loaded for testing. However - what you need to do is get the type of the backend and put the type into a List<String>. 

Backend code: 

package com.foo.htl.core;

import com.adobe.cq.sightly.WCMUsePojo;
import com.day.cq.search.PredicateGroup;
import com.day.cq.search.Query;
import com.day.cq.search.QueryBuilder;
import com.day.cq.search.result.SearchResult;
import com.day.cq.tagging.Tag;
import com.day.cq.tagging.TagManager;
  

import java.util.ArrayList;
import java.util.LinkedHashMap;
import java.util.List;
  
 
import javax.jcr.Node;
import javax.jcr.Session;
  

import org.apache.sling.api.resource.Resource;
import org.apache.sling.api.resource.ResourceResolver;
import org.apache.sling.api.resource.ValueMap;
import org.slf4j.Logger;
import org.slf4j.LoggerFactory;

 

import org.apache.sling.api.SlingHttpServletRequest;
import com.day.cq.wcm.foundation.Paragraph;  
import com.day.cq.wcm.foundation.ParagraphSystem;

import com.day.cq.wcm.foundation.Paragraph.Type; 
 
public class HeroTextPara
extends WCMUsePojo
{
 
    
    Logger logger = LoggerFactory.getLogger(HeroTextPara.class);
    
    
    private List<String> paragraphs;
     
    public List<String> getParagraphs() {
            return paragraphs;
        }
    public void setParagraphs(List<String> paragraphs) {
            this.paragraphs = paragraphs;
        }
      
    @Override
    public void activate() throws Exception {
          
       
          
        //esource resource = getResource("/content/geometrixx/en/services");
        
        ResourceResolver rs =  getResourceResolver();
        
        Resource r2 = rs.getResource("/content/geometrixx/en/services");
         
        SlingHttpServletRequest slingRequest = getRequest();
         
        ParagraphSystem parSys = ParagraphSystem.create(r2,slingRequest);
         
         this.paragraphs = new ArrayList();
         
         List<Paragraph> nn = parSys.paragraphs() ; 
         
         
         
         String myType = "" ; 
         int y=0 ; 
        for (Paragraph par: parSys.paragraphs()) {
             
            
            myType = par.getType().toString() ; 
            paragraphs.add(myType);
             y++; 
         }
        
        logger.info("******The VALUE OF nn "+nn.size()  + " -- PARA INFO "+parSys.getDefaultLayout()); 
      
       
    }
}

 

Front end code

<div data-sly-use.v="com.foo.htl.core.HeroTextPara">
<b>Here are the HTL results that display Paragraph info:</b>
    <ul data-sly-list="${v.paragraphs}"> 
        <li>${item} </li>
    </ul>   
</div>

View solution in original post

10 Replies

Avatar

Employee

I am not clear what is not working for you. You do see the different paragraphs?

Avatar

Employee

make sure you initialize this var:

 

private List<Paragraph> paragraphs;

Avatar

Level 4

Sightly is unable to read the data in paragraphs list. Its able to get the paragraphs in java and I am adding that paragraphs to a linked list and sending it to HTML. But Its not displaying the values in front end. I suspect its unable to read that paragraph object itself in front end.

Avatar

Level 4

Its a copy paste mistake. I have initailized the list now as linkedlist.

Avatar

Level 10

Looking at this code closer - is your Resource pointing to a valid Paragraph?? 

Avatar

Level 4

Yes. The data is coming correctly in the backend. I am converting a component from JSP to Sightly and that is where I am seeig the error. I need the paragraph data so that I can use that as a path to include a new component.

 

Existing JSP code looks like this:

<%

ParagraphSystem parSys = ParagraphSystem.create(resource, slingRequest); for (Paragraph par: parSys.paragraphs()) { %> <sling:include resource="<%= par %>"/> <%}%>

Now in order to convert this in sightly, I created a list in backend and added the paragraphs to the list and then iterating them in the front end to include it new component. In order to do this first I am cross checking whether I am able to get the data or not. But its unable to read the data.
 

Avatar

Level 10

Iterating through a list in HTL is easy -- see this artilce: 

https://helpx.adobe.com/experience-manager/using/htl_querybuilder.html

We use QueryBuilder on backend to populate a LIST instance then display the results in the front end. Use this as an example. 

Avatar

Level 10

Your front end code should look similiar to this: 

AEM QueryBuilder Sightly Example: 
<div data-sly-test="${properties.search}" data-sly-use.v="com.community.querybuilder.HelloService">
<b>Here are the QueryBuilder results that corrresponds to ${properties.search}:</b>
    <ul data-sly-list="${v.files}"> 
        <li>${item}</li>
    </ul>   
</div>

Avatar

Level 10

Can you post all of your Java code. I have attempted to run your code and i am getting 0 for y in log file - meaning no Paragraph objects. 

 

  @Override
    public void activate() throws Exception {
             
        Resource resource = getResource();
         
        SlingHttpServletRequest slingRequest = getRequest();
         
        ParagraphSystem parSys = ParagraphSystem.create(resource, slingRequest);
         
         this.paragraphs = new ArrayList();
         
         int y=0 ; 
        for (Paragraph par: parSys.paragraphs()) {
             
             paragraphs.add(par);
             y++; 
         }
        
        logger.info("****** VALUE OF Y "+y); 
            
    }

Log file: 

10.11.2016 14:55:38.306 *INFO* [0:0:0:0:0:0:0:1 [1478807738300] GET /content/parHTL/en/jcr:content/par/servicecomponent.html HTTP/1.1] com.foo.htl.core.HeroTextPara ****** VALUE OF Y 0

Avatar

Correct answer by
Level 10

I got it working - i changed the way Resource was loaded for testing. However - what you need to do is get the type of the backend and put the type into a List<String>. 

Backend code: 

package com.foo.htl.core;

import com.adobe.cq.sightly.WCMUsePojo;
import com.day.cq.search.PredicateGroup;
import com.day.cq.search.Query;
import com.day.cq.search.QueryBuilder;
import com.day.cq.search.result.SearchResult;
import com.day.cq.tagging.Tag;
import com.day.cq.tagging.TagManager;
  

import java.util.ArrayList;
import java.util.LinkedHashMap;
import java.util.List;
  
 
import javax.jcr.Node;
import javax.jcr.Session;
  

import org.apache.sling.api.resource.Resource;
import org.apache.sling.api.resource.ResourceResolver;
import org.apache.sling.api.resource.ValueMap;
import org.slf4j.Logger;
import org.slf4j.LoggerFactory;

 

import org.apache.sling.api.SlingHttpServletRequest;
import com.day.cq.wcm.foundation.Paragraph;  
import com.day.cq.wcm.foundation.ParagraphSystem;

import com.day.cq.wcm.foundation.Paragraph.Type; 
 
public class HeroTextPara
extends WCMUsePojo
{
 
    
    Logger logger = LoggerFactory.getLogger(HeroTextPara.class);
    
    
    private List<String> paragraphs;
     
    public List<String> getParagraphs() {
            return paragraphs;
        }
    public void setParagraphs(List<String> paragraphs) {
            this.paragraphs = paragraphs;
        }
      
    @Override
    public void activate() throws Exception {
          
       
          
        //esource resource = getResource("/content/geometrixx/en/services");
        
        ResourceResolver rs =  getResourceResolver();
        
        Resource r2 = rs.getResource("/content/geometrixx/en/services");
         
        SlingHttpServletRequest slingRequest = getRequest();
         
        ParagraphSystem parSys = ParagraphSystem.create(r2,slingRequest);
         
         this.paragraphs = new ArrayList();
         
         List<Paragraph> nn = parSys.paragraphs() ; 
         
         
         
         String myType = "" ; 
         int y=0 ; 
        for (Paragraph par: parSys.paragraphs()) {
             
            
            myType = par.getType().toString() ; 
            paragraphs.add(myType);
             y++; 
         }
        
        logger.info("******The VALUE OF nn "+nn.size()  + " -- PARA INFO "+parSys.getDefaultLayout()); 
      
       
    }
}

 

Front end code

<div data-sly-use.v="com.foo.htl.core.HeroTextPara">
<b>Here are the HTL results that display Paragraph info:</b>
    <ul data-sly-list="${v.paragraphs}"> 
        <li>${item} </li>
    </ul>   
</div>