Converting JSTL core tags into Sightly | Community
Skip to main content
lisa_burrow
lisa_burrow
Level 2
June 18, 2021
Solved

Converting JSTL core tags into Sightly

  • June 18, 2021
  • 2 replies
  • 1754 views

Hi,

I am very new to sightly and I need to convert the following code into Sightly.

<c:when test="${not empty properties.leftURL}">        --leftURL isn't a checkbox it is a field and I am checking that it has a URL in it
  <c:choose>
  <c:when test="${fn:startsWith(properties.leftURL, '/content')==true}">      --checking if it an internal or external URL
      <a href="${properties.leftURL}.html" target="_parent"><img src="<%= leftImage %>" alt="image"></a>
  </c:when>
  <c:otherwise>
      <a href="${properties.leftURL}" target="_parent"><img src="<%= leftImage %>" alt="image"></a>
  </c:otherwise>
  </c:choose>
</c:when>

Is there anyone who could help or give me advice me please?

I have spent a lot of time researching on the internet but can't find an example to use that can help me.

Thanks

Lisa.

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 BrianKasingli

@lisa_burrow,

When you are converting JSP Components to Sightly Components, you will discover that the JSP script has coupled view and backend logic. One of the ways that you can determine backend code when the JSP code calling a function with params, for example, "${fn:startsWith(properties.leftURL, '/content')==true}; keeping in mind, the JSP blocks of code with some computation logic, you can place this into the Sling Model backend.

TheView logic contains your HTML and <c:choose> block elements as such; which can be written in Sightly HTL. I work most efficiently with the Sightly documentation opened, https://github.com/adobe/htl-spec/blob/master/SPECIFICATION.md

Specifically, you are asking to convert JSTL to Sling Model, AEM global objects are available to Sling Models and Sightly, the AEM global objects should have most of the AEM’s core JSTL functionalities. Knowing the AEM global objects, you can swiftly convert JSPs to Sling Model and Sightlly, of course with API constraints, you will need to write your own logic. 

There is one blog article example here I made where it explains how JSP that is using the "sling" JSTL can be converted to Sightly and Sling Model, https://sourcedcode.com/blog/aem/taglib-prefix-sling-to-sightly-and-sling-model-non-jsp-non-jstl-implementation; however, this blog article is very specific for only the "sling" JSTL.

I hope this helps,
Brian.

 

 

 

2 replies

Ritesh_Mittal
Community Advisor and Adobe Champion
Ritesh_MittalCommunity Advisor and Adobe Champion
Community Advisor and Adobe Champion
June 18, 2021

Hi @lisa_burrow ,

 

To convert this code to HTL/Sightly, first you need to understand various blocks available and their usages in HTL.

We can separate presentation and business logic using HTL and Sling Model combination.

Now let's understand this code snippet, eventually what you want to achieve is to have an anchor tag. In one case appending html extension, whereas in another case without extension. So what we can do is to move the business logic to backend (Sling Model) and on HTL you can just add anchor tag.

(Note - below code is not optimized, it is just for reference-)

Sling Model -

public boolean getLeftURL() {
if(leftURL.startsWith("/content")){
return leftURL + ".html";
}else{
return leftURL;
}
return leftURL.startsWith("/content");
}

HTL

<a href="${model.leftURL}" target="_parent"><img src="<%= model.leftImage %>" alt="image"></a>

 

I have explained HTL/Sling Model in below videos-

https://www.youtube.com/watch?v=LhvSNVagoZk

https://www.youtube.com/watch?v=Wq93eTSdoC8

https://experienceleague.adobe.com/docs/experience-manager-htl/using/htl/block-statements.html?lang=en

 

    lisa_burrow
    lisa_burrowAuthor
    Level 2
    June 18, 2021
    Thank you for you help and advice, I will take a look at the videos and documents.
    BrianKasingli
    Community Advisor and Adobe Champion
    BrianKasingliCommunity Advisor and Adobe ChampionAccepted solution
    Community Advisor and Adobe Champion
    June 20, 2021

    @lisa_burrow,

    When you are converting JSP Components to Sightly Components, you will discover that the JSP script has coupled view and backend logic. One of the ways that you can determine backend code when the JSP code calling a function with params, for example, "${fn:startsWith(properties.leftURL, '/content')==true}; keeping in mind, the JSP blocks of code with some computation logic, you can place this into the Sling Model backend.

    TheView logic contains your HTML and <c:choose> block elements as such; which can be written in Sightly HTL. I work most efficiently with the Sightly documentation opened, https://github.com/adobe/htl-spec/blob/master/SPECIFICATION.md

    Specifically, you are asking to convert JSTL to Sling Model, AEM global objects are available to Sling Models and Sightly, the AEM global objects should have most of the AEM’s core JSTL functionalities. Knowing the AEM global objects, you can swiftly convert JSPs to Sling Model and Sightlly, of course with API constraints, you will need to write your own logic. 

    There is one blog article example here I made where it explains how JSP that is using the "sling" JSTL can be converted to Sightly and Sling Model, https://sourcedcode.com/blog/aem/taglib-prefix-sling-to-sightly-and-sling-model-non-jsp-non-jstl-implementation; however, this blog article is very specific for only the "sling" JSTL.

    I hope this helps,
    Brian.

     

     

     

      lisa_burrow
      lisa_burrowAuthor
      Level 2
      June 21, 2021
      Thank you for you help and advice, I will take a look at the documents.
      Terms & ConditionsAccessibility statement

      Loading footer...