AEM 6.4 - How to Read and Set the select dropdown value in Javascript in Coral3

karanmahi

07-03-2019

I have a dropdown in touch ui dialog. My requirement is to read the select value in javascript(clientlib) and based on that value I want to set the value in second dropdown and disable second dropdown so that author cannot select any other value. Somebody, provide any reference to make it work in coral-3.

<first jcr:primaryType="nt:unstructured" fieldLabel="First" name="./first" 
         sling:resourceType="granite/ui/components/coral/foundation/form/select">
<items jcr:primaryType="nt:unstructured"> <default jcr:primaryType="nt:unstructured" text="(default)" value="" />
<x jcr:primaryType="nt:unstructured" text="x" value="x" />
<y jcr:primaryType="nt:unstructured" text="y" value="y" />
<z jcr:primaryType="nt:unstructured" text="z" value="z" /> </items>
</first>

Accepted Solutions (1)

Accepted Solutions (1)

Arun_Patidar

MVP

08-03-2019

Hi,

I had created similar js to load dropdown based on page selecting in path browser. You can take reference.

Just set granite:id  to your both dropdown and create one hidden item to store/prepopulate second dropdown value.

aem63app-repo/dynamic-dropdown.js at master · arunpatidar02/aem63app-repo · GitHub

Answers (4)

Answers (4)

smacdonald2008

08-03-2019

In addition to Arun response (which we marked as correct) - we will see if we have other examples too.

We know that working with Granite types is a very popular topic. As a result, we have scheduled our community webinar - Ask the AEM Community Experts - to include this topic in May.

karanmahi

08-03-2019

@Arun - Can you please share the touch ui dialog content.xml so that I can understand the nodes and granite:class. Or, if you could attach the working package, that would be great.