Clear values in fields on Switch Dropdown Values | Community
Skip to main content
January 11, 2022
Solved

Clear values in fields on Switch Dropdown Values

  • January 11, 2022
  • 1 reply
  • 858 views

Hi

I have dropdown with 2 values. Each dropdown shows different fields .First one has pathfield and checkbox and second one have textfield.

Hide Show functionality is working good .Means fields are hiding when the other dropdown is selected.

But the values of fields are not getting cleared if i select the other dropdown,  it only just hide the fields values remain if switch back same dropdown value.

Below are the dialog  xml  and js is /libs/core/wcm/components/list/v1/list/clientlibs/editor/js/list.js

Can Somebody suggest solution?

 

 @leela-pavan-kumar 

 

<?xml version="1.0" encoding="UTF-8"?> <jcr:root xmlns:sling="http://sling.apache.org/jcr/sling/1.0" xmlns:granite="http://www.adobe.com/jcr/granite/1.0" xmlns:cq="http://www.day.com/jcr/cq/1.0" xmlns:jcr="http://www.jcp.org/jcr/1.0" xmlns:nt="http://www.jcp.org/jcr/nt/1.0" jcr:primaryType="nt:unstructured" jcr:title="demo" sling:resourceType="cq/gui/components/authoring/dialog" extraClientlibs="[core.wcm.components.list.v1.editor]"> <content granite:class="cmp-list--editor" jcr:primaryType="nt:unstructured" sling:resourceType="granite/ui/components/coral/foundation/container"> <items jcr:primaryType="nt:unstructured"> <tabs jcr:primaryType="nt:unstructured" sling:resourceType="granite/ui/components/coral/foundation/tabs" maximized="{Boolean}true"> <items jcr:primaryType="nt:unstructured"> <right jcr:primaryType="nt:unstructured" jcr:title="Demo" sling:resourceType="granite/ui/components/coral/foundation/container" margin="{Boolean}true"> <items jcr:primaryType="nt:unstructured"> <columns jcr:primaryType="nt:unstructured" sling:resourceType="granite/ui/components/coral/foundation/fixedcolumns" margin="{Boolean}true"> <items jcr:primaryType="nt:unstructured"> <column jcr:primaryType="nt:unstructured" sling:resourceType="granite/ui/components/coral/foundation/container"> <items jcr:primaryType="nt:unstructured"> <switchtab granite:class="cq-dialog-dropdown-showhide" jcr:primaryType="nt:unstructured" sling:resourceType="granite/ui/components/coral/foundation/form/select" fieldLabel="Switch Tab" name="./switchtab"> <granite:data jcr:primaryType="nt:unstructured" cq-dialog-dropdown-showhide-target=".list-option-switchtab-showhide-target"/> <items jcr:primaryType="nt:unstructured"> <one jcr:primaryType="nt:unstructured" text="One" value="one"/> <two jcr:primaryType="nt:unstructured" text="Two" value="two"/> </items> </switchtab> <one granite:class="hide list-option-switchtab-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="one"/> <items jcr:primaryType="nt:unstructured"> <heading granite:class="coral-Heading coral-Heading--4" jcr:primaryType="nt:unstructured" sling:resourceType="granite/ui/components/coral/foundation/heading" level="{Long}4" text="One"/> <well jcr:primaryType="nt:unstructured" sling:resourceType="granite/ui/components/coral/foundation/well"> <items jcr:primaryType="nt:unstructured"> <url jcr:primaryType="nt:unstructured" sling:resourceType="granite/ui/components/coral/foundation/form/pathfield" fieldLabel="Url" name="./url"/> <check jcr:primaryType="nt:unstructured" sling:resourceType="granite/ui/components/coral/foundation/form/checkbox" name="./check" text="Check" value="true"/> </items> </well> </items> </one> <two granite:class="hide list-option-switchtab-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="two"/> <items jcr:primaryType="nt:unstructured"> <heading granite:class="coral-Heading coral-Heading--4" jcr:primaryType="nt:unstructured" sling:resourceType="granite/ui/components/coral/foundation/heading" level="{Long}4" text="Two"/> <well jcr:primaryType="nt:unstructured" sling:resourceType="granite/ui/components/coral/foundation/well"> <items jcr:primaryType="nt:unstructured"> <pages granite:class="foundation-layout-util-maximized-alt coral-Form-fieldwrapper" jcr:primaryType="nt:unstructured" sling:resourceType="granite/ui/components/coral/foundation/container"> <items jcr:primaryType="nt:unstructured"> <text jcr:primaryType="nt:unstructured" sling:resourceType="granite/ui/components/coral/foundation/form/textfield" fieldLabel="Text" name="./text"/> </items> </pages> </items> </well> </items> </two> </items> </column> </items> </columns> </items> </right> </items> </tabs> </items> </content> </jcr:root>

 

 

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 Leela-Pavan-Kumar

Hi @vishgup07 ,

 

Handling At Dialog :

If you want to clear the values from the dialog based on selection, Clear the entered data in the input fields by writing a JS file based on the selection.

 

Use the below syntax and clear the values based on selection of dropdown

$('#id').val('');

 

Handling At Backend :

If you want to not to pass the values in the model.json please nullify the values based on the selection in the dropdown once after you injected them in backend.

1 reply

Leela-Pavan-Kumar
Leela-Pavan-KumarAccepted solution
Level 4
January 12, 2022

Hi @vishgup07 ,

 

Handling At Dialog :

If you want to clear the values from the dialog based on selection, Clear the entered data in the input fields by writing a JS file based on the selection.

 

Use the below syntax and clear the values based on selection of dropdown

$('#id').val('');

 

Handling At Backend :

If you want to not to pass the values in the model.json please nullify the values based on the selection in the dropdown once after you injected them in backend.