Your achievements

Level 1

0% to

Level 2

Tip /
Sign in

Sign in to Community

to gain points, level up, and earn exciting badges like the new
Bedrock Mission!

Learn more

View all

Sign in to view all badges

SOLVED

How do I access the properties of child pages?

Avatar

Level 1

I am building a small site using a dashboard,which provides thumbnail links for all of its child pages.  You can think of it as a products page/dashboard, and each child page is a detail page for a single product.  The attached image shows the custom property Product Group added to the page property sheet.

aem_custom_page_property.png

Here is the configuration for the custom property:

<group
   jcr:primaryType="nt:unstructured"
   sling:resourceType="granite/ui/components/coral/foundation/form/textfield"
   cq-msm-lockable="jcr:group"
   fieldLabel="Product Group"
   name="./jcr:group"
   renderReadOnly="{Boolean}true"
   required="{Boolean}false"/>

Then from the dashboard, I am attempting to read the child page properties Page object API and then dynamically build my dashboard. My first attempt was to use the getProperties() method, hoping that the page properties would be available there The code looks something like this:

use(function() {

   var data = {

   child_data: [],
   };
   var children = currentPage.listChildren();

   while (children.hasNext()){

   var child = children.next(),
   child_props = child.getProperties();
   data.child_data.push(child_props);
   }

   return data;
});

This does not return all of the page properties, however, just a small subset, e.g., jcr:title, jcr:created, etc.  What I need to build my dashboard is the title, my custom property, group, and the path to the page thumbnail.  I would really appreciate some guidance.

Cheers,

Sean

1 Accepted Solution

Avatar

Correct answer by
Level 3

So, I wouldn't use jcr:group as the property name unless you've added that to the jcr namespace.  Just use a custom property like "groupId" or "group".

Secondly, having a JavaScript class is kind of overkill for this situation (unless you have some business logic going on which you haven't presented).  You could simply use HTL for this.

<ul data-sly-repeat.child="${currentPage.listChildren}">

     <li>${child.properties['group']}</li>

</ul>

View solution in original post

0 Replies

Avatar

Correct answer by
Level 3

So, I wouldn't use jcr:group as the property name unless you've added that to the jcr namespace.  Just use a custom property like "groupId" or "group".

Secondly, having a JavaScript class is kind of overkill for this situation (unless you have some business logic going on which you haven't presented).  You could simply use HTL for this.

<ul data-sly-repeat.child="${currentPage.listChildren}">

     <li>${child.properties['group']}</li>

</ul>