template details to get while authoring component

Forum|Forum|1 year ago
January 12, 2025
5 replies
947 views

I have to show and hide few fields of the component dialog based on the template in which page is created.
for this im triggering clientlibs and making show and hide fields using js (show and hide works fine) but how to get template details to the js to make it work as per my condition?

Best answer by arunpatidar

Hi @sudarshanv1

You can rely on template policy to show hide component dialog fields.

granite:hide="${cqDesign.actionsDisabled}"

https://www.aemcq5tutorials.com/tutorials/expression-customizer-aem/

Example -

https://github.com/adobe/aem-core-wcm-components/blob/main/content/src/content/jcr_root/apps/core/wcm/components/teaser/v2/teaser/_cq_dialog/.content.xml#L43C49-L43C91

Tethich

Community Advisor

Hi @sudarshanv1

I know you already went with a custom clientlib where you intend to add your logic for hiding/showing fields based on some condition (in your case based on the page template), but I suggest trying another approach, using rendercondition:
https://developer.adobe.com/experience-manager/reference-materials/6-5/granite-ui/api/jcr_root/libs/granite/ui/docs/server/rendercondition.html

- You can use a render condition that calls a servlet, like in this example: https://medium.com/@arunpatidar26/custom-render-conditions-in-aem-392cae88a800
- Or you can use one that uses a Sling Model, https://ankanghosh-webdev.medium.com/granite-render-condition-in-aem-64d32f03a7d1

In both cases, the servlet or the model, you need to write Java code to detect what is the current page and find its template, and return a HTTP request attribute with a SimpleRenderCondition objact holding either true or false value, depending of your evaluation.

If you still want to go with your custom clientlib, I guess you can create your own servlet to which you make an ajax call from the clientlib JS code. In the servlet you can get the request path, based on it find the page resource and read the cq:template from it.

Uppari_Ramesh

@sudarshanv1 Add granite:renderCondition to the fields you want to show/hide based on template.

1. Create a component and sling model and get the current page details using scriptvariable annaotation and get the current page template and if the template matches with the one you wanted then you can return boolean.

2. You can use the same component/model for all the fields you want to hide/show based on template validation.

Do follow below article for creating render condition , component and model

https://ankanghosh-webdev.medium.com/granite-render-condition-in-aem-64d32f03a7d1

kapil_rajoria

Community Advisor

Hi @sudarshanv1, you can use the below code in a model to set the

@SlingObject
private ResourceResolver resourceResolver;

@Inject
private Resource resource;

@PostConstruct
public void init() throws PersistenceException {
try {
            PageManager pageManager = resourceResolver.adaptTo(PageManager.class);
            Page page = pageManager.getContainingPage(resource);
            Resource contentResource = page.getContentResource();
            String templatePath = contentResource.getValueMap().get("cq:template", String.class);
            //use string manupilation to get the template name from above line
            ModifiableValueMap valueMap = resource.adaptTo(ModifiableValueMap.class);
            if (valueMap != null) {
                valueMap.put("templateValue", templatePath); // Set the property
                resourceResolver.commit(); 
            } else {
                LOG.error("Could not adapt resource to ModifiableValueMap: {}", resource.getPath());
            }
        } catch (Exception e) {
            LOG.error("Error setting templateValue property", e);
        }
}

You can see a new property will be set in component's node structure on dragging and dropping it on the page.