Expand my Community achievements bar.

Dive into Adobe Summit 2024! Explore curated list of AEM sessions & labs, register, connect with experts, ask questions, engage, and share insights. Don't miss the excitement.

TouchUI Dialog xtype cqinclude equivalent

Avatar

Level 2

In classic ui dialogs we have been taking advantage of the cqinclude xtype in dialogs in order to reduce duplicate code.

One example of this is using separate xml files for reused dialog tabs as well as adding more tabs to the Page Properties of a page.

The dialog would look like this:

<?xml version="1.0" encoding="UTF-8"?> <jcr:root xmlns:cq="http://www.day.com/jcr/cq/1.0" xmlns:jcr="http://www.jcp.org/jcr/1.0" jcr:primaryType="cq:Dialog" height="400" stateful="false" xtype="dialog"> <items jcr:primaryType="cq:WidgetCollection"> <tabs jcr:primaryType="cq:TabPanel"> <items jcr:primaryType="cq:WidgetCollection"> <basic jcr:primaryType="cq:Widget" path="/libs/foundation/components/page/tab_basic.infinity.json" xtype="cqinclude" /> <advanced jcr:primaryType="cq:Widget" path="/libs/foundation/components/page/tab_advanced.infinity.json" xtype="cqinclude" /> <Custompageprop jcr:primaryType="cq:Widget" path="/apps/site/components/Pages/testPage/tab_custom.infinity.json" xtype="cqinclude" /> </items> </tabs> </items> </jcr:root>

And in the same page folder we would have an xml file named tab_custom.xml.

A second example of where we would like to use something like this would be when using the RTE in the Touch UI dialog.

In the old ui we would do something like this:

<example jcr:primaryType="cq:Widget" fieldLabel="Example" name="./example" removeSingleParagraphContainer="{Boolean}true" xtype="richtext"> <rtePlugins jcr:primaryType="nt:unstructured" path="/apps/site/components/content/rtecomponent/dialog/items/items/tab1/items/RTE/rtePlugins.infinity.json" xtype="cqinclude"/> </example>

This would allow us to minimize the duplicate code and file size for RTE's that have the same rtePlugins. You shouldn't have to repeat the same 40 lines of XML for every RTE in a dialog.

Is there some way to do this using something like Granite Include?

I know that in similar questions user smacdonald2008 commented saying he wouldn't recommend reusing dialog tabs so what would be the best course of action?

2 Replies

Avatar

Level 4

 Some developers like building a JCR node structure for each component. That is, each component has its own dialog. 

However - others like reusing parts of existing dialogs. See this artilce that will point you in the right direction: 

https://adobeaemtherightway.wordpress.com/2014/07/31/reusing-tabs-or-fields-from-an-existing-dialog/...

Avatar

Employee Advisor

You can use granite/ui/components/foundation/include resource type in the touch ui for including granite UI components in the current component dialogs. Take a look at the following example in crxde - /libs/wcm/foundation/components/page/cq:dialog/content/items/tabs/items/basic