Expand my Community achievements bar.

Dive into Adobe Summit 2024! Explore curated list of AEM sessions & labs, register, connect with experts, ask questions, engage, and share insights. Don't miss the excitement.
SOLVED

How to auto-populate form fields in AEM 6

Avatar

Level 2

I am experimenting with being able to autopopulate form fields on a form. I am trying this on the "Application for Assistance Form" in the Geometrixx-Gov site. 

I added a new dropdown box named "Color" with items 0=red 1=blue and I created a Text Box under the drop down list. 

What I want to accomplish is when the user selects "Red" as an option, the text box automatically populates to "Red"

1 Accepted Solution

Avatar

Correct answer by
Level 10

Why not use JQuery and build a form component. When one field changes - use  JQuery to set another:

http://api.jquery.com/val/

Implement JQuery by following this article: https://helpx.adobe.com/experience-manager/using/integrating-jquery-framework-cq.html

View solution in original post

2 Replies

Avatar

Correct answer by
Level 10

Why not use JQuery and build a form component. When one field changes - use  JQuery to set another:

http://api.jquery.com/val/

Implement JQuery by following this article: https://helpx.adobe.com/experience-manager/using/integrating-jquery-framework-cq.html

Avatar

Level 2

I'm very familiar with jquery and web development but very new to AEM and WCM. The way I've built the form is by dragging and dropping (see attached screenshot)

Where exactly can I implement jQuery here?

I see the following in content/forms/af/geometrixx-gov/applicaiton-for-assistance/.content.xml

 

                            <guidedropdownlist_0
                                jcr:created="{Date}2015-04-23T21:06:53.236-04:00"
                                jcr:createdBy="admin"
                                jcr:lastModified="{Date}2015-04-23T21:12:29.957-04:00"
                                jcr:lastModifiedBy="admin"
                                jcr:primaryType="nt:unstructured"
                                jcr:title="Drop-down list"
                                sling:resourceType="fd/af/components/guidedropdownlist"
                                assistPriority="custom"
                                guideNodeClass="guideDropDownList"
                                name="dropdownlist_0"
                                options="[0=red,1=black,2=blue]"/>
                            <guidetextbox_5
                                jcr:created="{Date}2015-04-23T21:12:51.050-04:00"
                                jcr:createdBy="admin"
                                jcr:lastModified="{Date}2015-04-23T21:12:51.050-04:00"
                                jcr:lastModifiedBy="admin"
                                jcr:primaryType="nt:unstructured"
                                jcr:title="Text box"
                                sling:resourceType="fd/af/components/guidetextbox"
                                guideNodeClass="guideTextBox"
                                name="textbox_5"/>