Reusable dialog definitions - How to make a component having multifield reusable

[kumarvipul]

I have created a simple component called link-field under  which i have a another node called link has a text field and pathfield. The .content.xml are :

<jcr:root xmlns:cq="http://www.day.com/jcr/cq/1.0" xmlns:jcr="http://www.jcp.org/jcr/1.0"

    jcr:primaryType="cq:Widget"

    xtype="multifieldpanel">

    <items jcr:primaryType="cq:WidgetCollection">

        <label

            jcr:primaryType="cq:Widget"

            allowBlank="{Boolean}false"

            fieldLabel="Link Label"

            name="./link/label"

            xtype="textfield"/>

        <destination

            jcr:primaryType="cq:Widget"

            allowBlank="{Boolean}false"

            fieldLabel="Link Destination"

            name="./link/destination"

            xtype="pathfield"/>

    </items>

I have created another component called multifieldLinkTest where i am calling this link component by mentioning path property /componentname.infinity.json and xtype cqinclude. here is the content.xml

<items jcr:primaryType="cq:WidgetCollection">

                    <link1

                        jcr:primaryType="cq:Widget"

                        collapsed="{Boolean}false"

                        collapsible="{Boolean}false"

                        title="Link1"

                        xtype="dialogfieldset">

                        <items jcr:primaryType="cq:WidgetCollection">

                            <fieldConfig

                                jcr:primaryType="cq:Widget"

                                path="/apps/te/components/widgets/link-field/link.infinity.json"

                                xtype="cqinclude"/>

                        </items>

                    </link1>

                    <link2

                        jcr:primaryType="cq:Widget"

                        collapsed="{Boolean}false"

                        collapsible="{Boolean}false"

                        title="Link2"

                        xtype="dialogfieldset">

                        <items jcr:primaryType="cq:WidgetCollection">

                            <fieldConfig

                                jcr:primaryType="cq:Widget"

                                path="/apps/te/components/widgets/link-field/link.infinity.json"

                                xtype="cqinclude"/>

                        </items>

                    </link2>

                </items>

 the problem is if in other component i add the same link node twice then in that values are not proper. its same for all the link nodes. let us suppose if you add three link node a,b and c. for each a, b and c we have label and destination field.

if i enter any value in a[link] it will be by default same for b[link] and c[link]. if suppose if you add any value in b or c it will be added all together like a[link],b[link].c[link] and will b same for these three nodes. 

Is there any way through which we can store or read the proper values ??

Thanks,

Vipul

[justin_at_adobe]

Hi Vipul,

This is expected as the names are going to be the same. What you might want to do is to create your own ExtJS wiget which would allow you to pass in different names to avoid this kind of conflict.

Regards,

Justin

[kumarvipul]

Hi Justin,

I can create a custom widget where i can define the xtype.  But in that case i have to define evrything linke component fileds, setValue, getValue and register.

What i was looking for that let us suppose i have created a component which has a dialog where we have defined the fileds. The same component i want to use in another component by means of providing  path = componentlocation/componentName.infinity.json and xtype =cqinclude. 

I don't want to define/initialize the dailog fields in side the ExtJs . what i want is just to set/get the values in proper format. How could we achieve this through ExtJs or by any other means?

Thanking you.

Regards,

Vipul Kumar

[Ove_Lindström · Accepted solution]

Have your component discover where is it put and generate the name itself based on the path. You still would have to do your own ExtJS or extend the functionality of the used components.

What you have is a usage definition that you can share beween components. This is usefull when you have the definition of the property in the parent component and want to the ability to override the properties in a child component. Or if you want to define a tab with commonly used properties. This means that it overrides the property definition and that is the current pattern of this sort of usage.

If you want to have another behavior, then you need to create it. OOTB, there is no way to use the same definition with different nameing of properties.

/Ove