Touch UI - reusing dialog field but with a different property name for each component | Community
Skip to main content
Level 4
August 14, 2020
Solved

Touch UI - reusing dialog field but with a different property name for each component

  • August 14, 2020
  • 2 replies
  • 3156 views

I am re-using RTE dialog across multiple components using granite/ui/components/foundation/include. But I want the node property name to be different for each component where I am reusing this RTE. I dont want to derive the property name from the base component where I have this RTE dialog defined initially.

Along with the path and sling resource type, I also tried giving the name property as well in the component node where we are including this re-usable rte dialog but still the data is getting stored under the property name which we was defined for the initial RTE tab. Is it possible to fix it ?

This post is no longer active and is closed to new replies. Need help? Start a new post to ask your question.
Best answer by BrianKasingli

@nalla0109 I know exactly that you mean. You want to change the property name (name attribute) for specific Granite UI form element during include. Sorry, but the Granite UI does not allow you to dynamically change the name attribute when it's included. With that limitation in mind, you can do something like this:

 

<introDescription jcr:primaryType="nt:unstructured" sling:resourceType="cq/gui/components/authoring/dialog/richtext" fieldLabel="Intro Description" required="{Boolean}true" useFixedInlineTaoolbar="{Boolean}true" name="./introDescription"> <rtePlugins jcr:primaryType="nt:unstructured" sling:resourceType="granite/ui/components/coral/foundation/include" path="/apps/my-site/components/dialog/content/common/fields/cq:dialog/commonFields/items/componentSimpleRTE/rtePlugins"/> <uiSettings jcr:primaryType="nt:unstructured" sling:resourceType="granite/ui/components/coral/foundation/include" path="/apps/my-site/components/dialog/content/common/fields/cq:dialog/commonFields/items/componentSimpleRTE/uiSettings"/> </introDescription>

The example above showcases the re-use of the common rtePlugins and uiSettings configuration, leaving the declaration of the Granite UI component's initial settings adjustable to the current dialogue settings; the initial settings can change the name attribute.

 

2 replies

arunpatidar
Community Advisor
Community Advisor
August 15, 2020

Hi,

Use Sling Resource Merger to achieve this or reuse RTE plugins like below :

 

<text jcr:primaryType="nt:unstructured" sling:resourceType="cq/gui/components/authoring/dialog/richtext" fieldDescription="Title, default value is page title" fieldLabel="Title" name="./title" useFixedInlineToolbar="{Boolean}true"> <rtePlugins jcr:primaryType="nt:unstructured" sling:resourceSuperType="/apps/my-project/components/structure/dailog-includes/fragments-dlg/rteConf1/rtePlugins"/> <uiSettings jcr:primaryType="nt:unstructured" sling:resourceSuperType="/apps/my-project/components/structure/dailog-includes/fragments-dlg/rteConf1/uiSettings"/> </text>

 

 

Arun Patidar
BrianKasingli
Community Advisor and Adobe Champion
BrianKasingliCommunity Advisor and Adobe ChampionAccepted solution
Community Advisor and Adobe Champion
August 15, 2020

@nalla0109 I know exactly that you mean. You want to change the property name (name attribute) for specific Granite UI form element during include. Sorry, but the Granite UI does not allow you to dynamically change the name attribute when it's included. With that limitation in mind, you can do something like this:

 

<introDescription jcr:primaryType="nt:unstructured" sling:resourceType="cq/gui/components/authoring/dialog/richtext" fieldLabel="Intro Description" required="{Boolean}true" useFixedInlineTaoolbar="{Boolean}true" name="./introDescription"> <rtePlugins jcr:primaryType="nt:unstructured" sling:resourceType="granite/ui/components/coral/foundation/include" path="/apps/my-site/components/dialog/content/common/fields/cq:dialog/commonFields/items/componentSimpleRTE/rtePlugins"/> <uiSettings jcr:primaryType="nt:unstructured" sling:resourceType="granite/ui/components/coral/foundation/include" path="/apps/my-site/components/dialog/content/common/fields/cq:dialog/commonFields/items/componentSimpleRTE/uiSettings"/> </introDescription>

The example above showcases the re-use of the common rtePlugins and uiSettings configuration, leaving the declaration of the Granite UI component's initial settings adjustable to the current dialogue settings; the initial settings can change the name attribute.

 

nalla0109Author
Level 4
August 17, 2020

Thanks @briankasingli for the update. I have tried this way but for some reason, UI settings and RTE plugins doesn't get picked up. However when I refer the RTE plugins and UI settings using sling:resourceSuperType then it works.

<Bodytext jcr:primaryType="nt:unstructured" sling:resourceType="cq/gui/components/authoring/dialog/richtext" fieldLabel="Body Text" name="./bodytext" removeSingleParagraphContainer="{Boolean}true" useFixedInlineToolbar="{Boolean}true"> <rtePlugins jcr:primaryType="nt:unstructured" sling:resourceType="granite/ui/components/coral/foundation/include" path="/apps/testapp/components/base/rtePlugins"/> <uiSettings jcr:primaryType="nt:unstructured" sling:resourceType="granite/ui/components/coral/foundation/include" path="/apps/testapp/components/base/uiSettings"/> </Bodytext>

This didn't work

 

 

<Bodytext jcr:primaryType="nt:unstructured" sling:resourceType="cq/gui/components/authoring/dialog/richtext" fieldLabel="Body Text" name="./bodytext" removeSingleParagraphContainer="{Boolean}true" useFixedInlineToolbar="{Boolean}true"> <rtePlugins jcr:primaryType="nt:unstructured" sling:resourceSuperType="/apps/testapp/components/base/rtePlugins"/> <uiSettings jcr:primaryType="nt:unstructured" sling:resourceSuperType="/apps/testapp/components/base/uiSettings"/> </Bodytext>

 

This worked 

Level 2
February 14, 2023

This is the correct answer, exactly what I was looking for.