Solved
can we add two dropdown showhide?
i want to do showhide of fields in dialog on selection of dropdown.
here, i have two dropdowns.
one is working fine but another is not working with core js.
can someone help here?
konstantyn_diachenkoAccepted solution
Community Advisor
Jan 21, 2025 11:01 PM UTC
its AEM - AMS 6.5 instance with serivepack latest
Hi @sudarshanv1 ,
Yes, you are right. I checked it. I made a typo in granite:class selectors.
Fixed version you can find here:
<?xml version="1.0" encoding="UTF-8"?>
<jcr:root xmlns:jcr="http://www.jcp.org/jcr/1.0" xmlns:nt="http://www.jcp.org/jcr/nt/1.0" xmlns:granite="http://www.adobe.com/jcr/granite/1.0" xmlns:cq="http://www.day.com/jcr/cq/1.0" xmlns:sling="http://sling.apache.org/jcr/sling/1.0"
jcr:primaryType="nt:unstructured"
sling:resourceType="cq/gui/components/authoring/dialog">
<content
jcr:primaryType="nt:unstructured"
sling:resourceType="granite/ui/components/coral/foundation/tabs">
<items jcr:primaryType="nt:unstructured">
<config
jcr:primaryType="nt:unstructured"
jcr:title="Config"
sling:resourceType="granite/ui/components/coral/foundation/container">
<items jcr:primaryType="nt:unstructured">
<variation
granite:class="cq-dialog-dropdown-showhide"
jcr:primaryType="nt:unstructured"
sling:resourceType="granite/ui/components/coral/foundation/form/select"
name="./variation">
<items jcr:primaryType="nt:unstructured">
<backgroundImage
jcr:primaryType="nt:unstructured"
text="Background image"
value="backgroundImage"/>
<topImage
jcr:primaryType="nt:unstructured"
text="Top image"
value="topImage"/>
<noImage
jcr:primaryType="nt:unstructured"
text="No image"
value="noImage"/>
</items>
<granite:data
jcr:primaryType="nt:unstructured"
cq-dialog-dropdown-showhide-target=".card-variation-showhide-target"/>
</variation>
<cardSizeContainer
granite:class="hide card-variation-showhide-target foundation-layout-util-vmargin"
jcr:primaryType="nt:unstructured"
sling:resourceType="granite/ui/components/coral/foundation/container">
<granite:data
jcr:primaryType="nt:unstructured"
showhidetargetvalue="topImage"/>
<items jcr:primaryType="nt:unstructured">
<variation
jcr:primaryType="nt:unstructured"
sling:resourceType="granite/ui/components/coral/foundation/form/select"
name="./cardSize">
<items jcr:primaryType="nt:unstructured">
<medium
jcr:primaryType="nt:unstructured"
text="Medium"
value="medium"/>
<large
jcr:primaryType="nt:unstructured"
text="Large"
value="large"/>
</items>
</variation>
</items>
</cardSizeContainer>
<cardType
granite:class="cq-dialog-dropdown-showhide"
jcr:primaryType="nt:unstructured"
sling:resourceType="granite/ui/components/coral/foundation/form/select"
name="./cardType">
<items jcr:primaryType="nt:unstructured">
<circle
jcr:primaryType="nt:unstructured"
text="Circle"
value="circle"/>
<square
jcr:primaryType="nt:unstructured"
text="Square"
value="square"/>
<triangle
jcr:primaryType="nt:unstructured"
text="Triangle"
value="triangle"/>
</items>
<granite:data
jcr:primaryType="nt:unstructured"
cq-dialog-dropdown-showhide-target=".card-type-showhide-target"/>
</cardType>
<squareTypeContainer
granite:class="hide card-type-showhide-target foundation-layout-util-vmargin"
jcr:primaryType="nt:unstructured"
sling:resourceType="granite/ui/components/coral/foundation/container">
<granite:data
jcr:primaryType="nt:unstructured"
showhidetargetvalue="square"/>
<items jcr:primaryType="nt:unstructured">
<enableSquareShadow
jcr:primaryType="nt:unstructured"
sling:resourceType="granite/ui/components/coral/foundation/form/checkbox"
checked="false"
name="./enableSquareShadow"
text="Enable square shadow"
uncheckedValue="false"
value="true"/>
</items>
</squareTypeContainer>
</items>
</config>
</items>
</content>
</jcr:root>
Best regards,
Kostiantyn Diachenko.
Kostiantyn Diachenko, Community Advisor, Certified Senior AEM Developer, creator of free AEM VLT Tool, maintainer of AEM Tools plugin.