Adobe CQ Components restricting child components

Question

I am trying to create a component for a simple accordion, where blocks of content are held under headings and only one heading is visible at a time. My preferred implementation uses two components, one to represent the whole accordion and a second component for a single entry.

The idea is that a content author can pull the accordion in from the sidekick, then drop one or more accordion items into the accordion, but not allow any other components to be dropped here. The accordion items should only be able to be dropped into the accordion component and not within any other parsys.

My problem is that currently it is possible to add other content into the accordion and add accordion items outside of the accordion.

The first attempt to solve this was:

foobar/components/accordion
foobar/components/accordion/accordion.jsp
foobar/components/accordion/cq:editConfig
foobar/components/accordion/dialog
foobar/components/accordion/accordionitem
foobar/components/accordion/accordionitem/accordionitem.jsp
foobar/components/accordion/accordionitem/cq:editConfig
foobar/components/accordion/accordionitem/dialog

These are the config files from this are:

accordion/.content.xml

<jcr:root xmlns:sling="http://sling.apache.org/jcr/sling/1.0"
    xmlns:cq="http://www.day.com/jcr/cq/1.0"
    xmlns:jcr="http://www.jcp.org/jcr/1.0"
    cq:isContainer="{Boolean}true"
    jcr:primaryType="cq:Component"
    jcr:title="Accordion"
    sling:resourceSuperType="foundation/components/parbase"
    allowedChildren="[*/accordion/accordionitem]"
    allowedParents="[*/parsys]"
    componentGroup="General"/>

accordion/_cq_editConfig.xml

<jcr:root xmlns:cq="http://www.day.com/jcr/cq/1.0"
    xmlns:jcr="http://www.jcp.org/jcr/1.0"
    cq:actions="[-,edit,-,delete]"
    cq:layout="editbar"
    jcr:primaryType="cq:EditConfig">
    <cq:listeners
        jcr:primaryType="cq:EditListenersConfig"
        aftercopy="REFRESH_PAGE"
        afterdelete="REFRESH_PAGE"
        afterinsert="REFRESH_PAGE"/>
</jcr:root>

The dialog is blank and exists only so that the component will appear in the sidekick.

accordion.jsp simply includes the foundation parsys.

accordion/accordionitem/.content.xml

<jcr:root xmlns:sling="http://sling.apache.org/jcr/sling/1.0"
    xmlns:cq="http://www.day.com/jcr/cq/1.0"
    xmlns:jcr="http://www.jcp.org/jcr/1.0"
    jcr:primaryType="cq:Component"
    jcr:title="Accordion Item"
    sling:resourceSuperType="foundation/components/parbase"
    allowedParents="[*/accordion]"
    componentGroup="General"/>

The accordion item dialog takes in the title. The editConfig simply adds the toolbar, but no listeners.

accordionitem.jsp outputs the title taken from the dialog and has a parsys.

My problem seems to be that the parsys aren't using the rules for the accordion and accordionitem components. Instead they seem to inherit from the next parsys up instead, unless overwritten.

I can set the components correctly by using edit mode on the page and selecting the appropriate components, but that sets the information against the template, meaning I need to perform the same configuration for every page template. What I want is to have it defined in the component definition instead so that it exists once.

After first writing the components I found this blog, which describes exactly the same scenerio: http://jenikya.com/blog/2012/03/cq5-accordion-component.html

Using that as I reference, I tried adding an extension of parsys to use within accordion.jsp instead. This made no difference to the code, so even my custom parsys allowed components other than accordion item to be added.

Any guidance on either what is wrong or other approaches to take will be greatly appreciated.

Trubow

Answer 1

The solution here would be to use a parsys and build a composite component to restrict the accordion content to a set of components only (as described in the blog entry).

Have a look at http://localhost:4502/content/geometrixx/en/company/press/asseteditor.html which also uses this technique for the dam/components/asseteditor/thumbnail component.

Helenahelene

Answer 2

This is a very generic problem statement in AEM. There are several ways to handle it, depends on your business need and how your design will map this. I can suggest two solution for this: 1. Apply Template level design restriction for your accordion component. Which means, you drop accordion component and then go to design mode of page and in accordion par select accordion item component. This is one time activity only.

Though i would recommend option #2: 2. In accordion component dialog, ask author to add accordion item using multilist. - To add a new item, simply open accordion dialog and add item in multilist and enter accordion id in it. - To remove item, open dialog and remove item from multilist - To change position, rearrange items in multilist. Based on no of multilist items entered by author in Accordion dialog, statically include accordion item component and give component id entered by author in multilist.

Using this approach, you will - easily restrict component in accordion. - Reduce one component (accordion item) in sidekick - Reduce one parsys on page (so many parsys eat authoring performance)

Jarrad

Would you be able to go into more detail of how you would add your components to your component after getting the values from your multifield? – Jansson