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
BedrockMission!

Learn More

View all

Sign in to view all badges

Re-use properties as set of classes name in multiple components

Avatar

Avatar
Give Back 5
Level 2
angelinek209805
Level 2

Likes

6 likes

Total Posts

25 posts

Correct Reply

0 solutions
Top badges earned
Give Back 5
Give Back 3
Give Back
Ignite 1
Validate 1
View profile

Avatar
Give Back 5
Level 2
angelinek209805
Level 2

Likes

6 likes

Total Posts

25 posts

Correct Reply

0 solutions
Top badges earned
Give Back 5
Give Back 3
Give Back
Ignite 1
Validate 1
View profile
angelinek209805
Level 2

09-11-2018

I understand that is possible re-use tab in cq:dialog in multiple components, using sling:resourceType: granite/ui/components/foundation/include

For example:

path:  foundation/components/page/cq:dialog/content/items/tabs/items/basic
sling:resourceType: granite/ui/components/foundation/include

My question is if is also possible to re-use the properties value also in multiple component in the HTL code?

For example in the re-usable tab, it will generate value for ${properties.item1}, ${properties.item2}, ${properties.item3}… up to item6 and in the component HTL, I will use to value as classes name eg <div class=“${properties.otherItemClass} ${properties.item1} ${properties.item2} ${properties.item3}”></div>

For the ease of maintenance, I want to re-use the same set of classes name for all the other component. Is there a way to achieve this? Is it possible to use data-sly-include for only classes name? Something like <div class=“${properties.otherItemClass} data-sly-include=“path/to/tabClassesName”“>Unique component HTL codes</div>

Thanks in advance.

Replies

Avatar

Avatar
Coach
MVP
Arun_Patidar
MVP

Likes

1,346 likes

Total Posts

3,223 posts

Correct Reply

915 solutions
Top badges earned
Coach
Contributor 2
Ignite 10
Give Back 700
Boost 1000
View profile

Avatar
Coach
MVP
Arun_Patidar
MVP

Likes

1,346 likes

Total Posts

3,223 posts

Correct Reply

915 solutions
Top badges earned
Coach
Contributor 2
Ignite 10
Give Back 700
Boost 1000
View profile
Arun_Patidar
MVP

09-11-2018

Hi,

If you want to reuse some field of dialog you can do it by using inheritance(sling:resourceSuperType). But in page you need to store value saparately until you don't write custom code to check and get value from other nodes.

If you want to use same value across the template, you can create design dialog instead dialog and get design dialog value inside any components.

Hope this would help.

Avatar

Avatar
Give Back 5
Level 2
angelinek209805
Level 2

Likes

6 likes

Total Posts

25 posts

Correct Reply

0 solutions
Top badges earned
Give Back 5
Give Back 3
Give Back
Ignite 1
Validate 1
View profile

Avatar
Give Back 5
Level 2
angelinek209805
Level 2

Likes

6 likes

Total Posts

25 posts

Correct Reply

0 solutions
Top badges earned
Give Back 5
Give Back 3
Give Back
Ignite 1
Validate 1
View profile
angelinek209805
Level 2

09-11-2018

Thanks for your quick response.

Since the component already has a reference to inheritance(sling:resourceSuperType), I could not use that.

The properties value will be independent per page so would not set it as design dialog.

Maybe I can use the same JS Use API as suggested in cq5 - Multiple properties from cq-dialog to dom template AEM - Stack Overflow ?

Avatar

Avatar
Coach
MVP
Arun_Patidar
MVP

Likes

1,346 likes

Total Posts

3,223 posts

Correct Reply

915 solutions
Top badges earned
Coach
Contributor 2
Ignite 10
Give Back 700
Boost 1000
View profile

Avatar
Coach
MVP
Arun_Patidar
MVP

Likes

1,346 likes

Total Posts

3,223 posts

Correct Reply

915 solutions
Top badges earned
Coach
Contributor 2
Ignite 10
Give Back 700
Boost 1000
View profile
Arun_Patidar
MVP

09-11-2018

Yes, you can go for Java Model or JS to generate json or list from existing tab item.