Show/Hide Dialog if one dropdown option or another is selected
I have a dropdown with three options [a, b, c].
Two of my dialog fields are only valid for two dropdown options [b, c]
Is there some OOTB way to show two dialog fields if 'b' or 'c' is selected in the dropdown with showhidetargetvalue?
<layout
jcr:primaryType="nt:unstructured"
granite:class="cq-dialog-dropdown-showhide"
sling:resourceType="granite/ui/components/foundation/form/select"
class="cq-dialog-dropdown-showhide"
cq-dialog-dropdown-showhide-target=".layout-showhide-target"
fieldLabel="Select component layout"
name="./layout">
<items jcr:primaryType="nt:unstructured">
<option-1
jcr:primaryType="nt:unstructured"
text="option 1"
value="option-1"/>
<option-2
jcr:primaryType="nt:unstructured"
text="option 2"
value="option-2/>
<option-3
jcr:primaryType="nt:unstructured"
text="option 3"
value="option-3"/>
</items>
<granite:data
jcr:primaryType="nt:unstructured"
cq-dialog-dropdown-showhide-target=".list-option-listfrom-showhide-target"/>
</layout> <dialog-img
jcr:primaryType="nt:unstructured"
sling:resourceType="granite/ui/components/foundation/container"
class="hide layout-showhide-target"
showhidetargetvalue="option-2">
<items jcr:primaryType="nt:unstructured">
<img-url
jcr:primaryType="nt:unstructured"
sling:resourceType="granite/ui/components/coral/foundation/form/textfield"
fieldLabel="Image Clickthrough URL"
fieldDescription="Remember to check for empty spaces."
name="./imgUrl"
required="{Boolean}false"
value="https://www.missing_XXXXX_link.com/"/>
<img
jcr:primaryType="nt:unstructured"
sling:resourceType="granite/ui/components/coral/foundation/form/textfield"
fieldLabel="Image Path (https://dsg.images.harmony.epsilon.com/)"
name="./img"
required="{Boolean}false"
value="https://dummyimage.com/1200x1000/fffb00/1a1a1a.jpg?text=Missing+assets"/>
</items>
</dialog-img>