Cannot remove component with responsivegrid from editable template

[srinir44531418]

We have a component with a coded in responsive grid (code below). When we add this component to the editable template, template author could not delete any more.

Search on forums turned up something that vaguely referenced Synthetic Resource and need to create content using cq:template.

Appreciate if anyone can explain WHY this type of component, once added to the template, cannot be deleted. And any workaround without having to ask template authors to add content (to satisfy responsive grid) before being able to delete the component from template (structure).

<div data-sly-resource="${'content' @ resourceType='wcm/foundation/components/responsivegrid'}"></div>

[smacdonald2008]

Typically components added to an editable template cannot be deleted by an author. Do not put in components into a responsive grid at the editable template level. Should be placed in the page level to let authors add/delete a component.

[srinir44531418]

Perhaps I have to elaborate on the issue. Here is how to reproduce:

1. Lets say we have two components - Component A and Component B.

2. Component A has simple HTL, say

<h1>This is Component A</h1>

3. Component B has following HTL

<h1>This is Component B</h1>

<div data-sly-resource="${'content' @ resourceType='wcm/foundation/components/responsivegrid'}"></div>

4. As "Template Author", edit a blank template and add Component A and Component B to the template in "Structure" mode.

5. As "Template Author", try to delete Component A and Component B from the Template.

Result:

1. As Template Author, you will see "Delete" option for Component A but NOT for Component B.

All of this usecase is on Template itself, not on a page and not as regular page author /editor.

Here is the thread I found on the same topic. adobe - Not able to remove components in Editable Template AEM - Stack Overflow

Hope this clarifies the issue.

[arunpatidar]

Hi,

As suggested; for quick fix, you can

• Add content to the responsive grid in the component you are trying to delete.
• Refresh the page
• Delete the structure component

[srinir44531418]

Thanks. I am trying to understand why it behaves the way it does. And a programmatic fix rather than having to ask Template Authors to go through the work of putting content in, just to remove the component they just added to the template.

[smacdonald2008]

Your authors should be working with components (adding, modifying, nd deleting) at page level. The components that an author works with are defined within the policies in editable templates. This reflects best practice.

Only components set in an editable templates are fixed components that an author cannot modify.

[smacdonald2008]

see the weekend tutorial for info on editable templates, components, and best practice around responsive grid --Getting Started with AEM Sites - WKND Tutorial

[arunpatidar]

Hi @srinir44531418

The issue is when you create dropzone using parsys or responsive grid, the node(e.g. content) is created when the component is dropped, here the node is not getting created that causing the issue.

But we can force node creation using cq:template.

To enable deletion for component B, follow the below step:

1. update component B code as below;
   <h2>This is Component B</h2>
   <div data-sly-resource="content"></div>
2. Create cq:template node under componentB(CompB)
3. Create content node under cq:template node and add sling:resourceType property to content node

      sling:resourceType = wcm/foundation/components/responsivegrid

[vijaymnnit06]

Hi @arunpatidar 

I am also facing the same issue. I tried creating cq:template node and putting relevant node under this. Followed all the steps as suggested but still delete option is not coming. Even I am not using any cq:actions under cq:editConfig node. Followed the suggestions at https://stackoverflow.com/questions/50447249/not-able-to-remove-components-in-editable-template-aem as well but somehow not working for me. I am using AEM 6.5. Is there any other approach?

[arunpatidar]

can you check for new page, for existing pages, cq:template has no effect.