Hi All,
I have a breadcrumb component When I check the HTML code of the breadcrumb on page, there is some JSP logic is shown and not translated correctly.
<sly data-sly-test="${! currentpage.properties.breadcrumbsHide}">
<sly data-sly-use.crumb="com.atlascopco.aem.ac_commons.core.components.BreadCrumb">
<sly data-sly-test="${!crumb.emptyBreadcrumb}">
<div class="c-row">
<div class="c-breadcrumb">
<ul class="o-list c-breadcrumb__list" data-sly-list.breadCrumb="${crumb.breadCrumbEntries}">
<li class="c-breadcrumb__item">
<a href="${breadCrumb}.html"
onclick="CQ_Analytics.record({event:'followBreadcrumb',values: { breadcrumbPath: '<%=xssAPI.getValidHref(sample.getPath())%>' },collect: false,options: { obj: this },componentPath: '<%=resource.getResourceType()%>'})"
class="c-breadcrumb__link">${crumb.breadCrumbEntries[breadCrumb]}</a>
</li>
<li data-sly-test="${breadCrumbList.last}" class="c-breadcrumb__item">${crumb.text}</li>
</ul>
</div>
</div>
</sly>
</sly>
</sly>
I tried adding @CONTEXT='scriptString', 'html', 'text' on <%=xssAPI.getValidHref(sample.getPath())%>' } but nothing works.
When I check sample.getPath() on the console I am getting sample not defined.
Solved! Go to Solution.
Views
Replies
Total Likes
HI @Vani1012 ,
I think these Steps might helps you.
Step 1: Write two more methods in your existing Java Model class "crumb" to print your breadcrumb path & Resource Type. Here I gave sample code.
@ValueMapValue(name=PROPERTY_RESOURCE_TYPE, injectionStrategy=InjectionStrategy.OPTIONAL)
@Default(values="No resourceType")
protected String resourceType;
public String getResourceType() {
return resourceType;
}
public String getcurrentPagePath() {
currentPagePath = Optional.ofNullable(pageManager)
.map(pm -> pm.getContainingPage(currentResource))
.map(Page::getPath).orElse("");
return currentPagePath;
}
Step 2: Remove JSP code & pick path & resourceType from the java class as shown below.
onclick='CQ_Analytics.record({
event:"followBreadcrumb",
values: { breadcrumbPath: ${crumb.currentPagePath} },
collect: false,options: { obj: this },
componentPath: ${crumb.resourcePath}
})'
Please let me know if this helps!
Regards,
Aditya Ch.
Hi @Vani1012
It is recommended to convert JSP into Java of JS and use it in HTL: https://experienceleaguecommunities.adobe.com/t5/adobe-experience-manager/invoking-method-inside-jsp...
Hope this helps.
Thanks,
Kiran Vedantam.
HI @Vani1012 ,
I think these Steps might helps you.
Step 1: Write two more methods in your existing Java Model class "crumb" to print your breadcrumb path & Resource Type. Here I gave sample code.
@ValueMapValue(name=PROPERTY_RESOURCE_TYPE, injectionStrategy=InjectionStrategy.OPTIONAL)
@Default(values="No resourceType")
protected String resourceType;
public String getResourceType() {
return resourceType;
}
public String getcurrentPagePath() {
currentPagePath = Optional.ofNullable(pageManager)
.map(pm -> pm.getContainingPage(currentResource))
.map(Page::getPath).orElse("");
return currentPagePath;
}
Step 2: Remove JSP code & pick path & resourceType from the java class as shown below.
onclick='CQ_Analytics.record({
event:"followBreadcrumb",
values: { breadcrumbPath: ${crumb.currentPagePath} },
collect: false,options: { obj: this },
componentPath: ${crumb.resourcePath}
})'
Please let me know if this helps!
Regards,
Aditya Ch.
Hi @Vani1012 , As @Kiran_Vedantam mentioned as per best practices, we should try to leverage HTL instead of jsp. I would also like to suggest to explore if the Breadcrumb component from the AEM core component library matches your requirements and use that.
what is sample in
sample.getPath()
You don't have to use explicit xssAPI.getValidHref(sample.getPath()) for link instead use HTL context e.g. url
href="${sample.path @ context='uri'}
I think the expression is not correct that is why it is ot working, I would suggest try to debug below
onclick="CQ_Analytics.record({event:'followBreadcrumb',values: { breadcrumbPath: '<%=xssAPI.getValidHref(sample.getPath())%>' },collect: false,options: { obj: this },componentPath: '<%=resource.getResourceType()%>'})"
Views
Likes
Replies