How to auto-populate form fields in AEM 6

[bhaarats4680380]

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"

[smacdonald2008 · Accepted solution]

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

[bhaarats4680380]

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"/>