Results
The form should already be filled in for you based on the chosen color. If you chose Blue for Mario, it won’t seem like it did much because that’s the first option in our select drop down. Go back and choose another color and see what’s different.
What’s going on, on this page?
First, the previous page sent us 2 things, the query var “color” along with the actual color of the button we clicked.
Second the anchor tag which also matches the color of the button we clicked. The anchor tag matches section id’s below to scroll us to that specific section. So clicking the red button scrolls us to Diddy Kong.
The web form select field above not only has the 4 options w/ pipe symbols for values like:
Mario|blue
Diddy Kong|red
Yoshi|green…
…but also has the “default value” (advanced tab) dynamic field set to “request parameter” with the GET option set to “color” which is what automatically chooses the proper “selected” value based on the query var passed in the url.
This form is additionally fun because it passes the shortcode value of the select field back to the redirect url (which happens to be the page we just came from).
An additional item was included on that page but only visible when coming back from this web form.
The redirect url for the web form is formatted as follows:
https://wplovr.com/chooser-demo/?color=[field id="color"]
And just like our web form above, capturing the “color” query var, we pass another along and do that same with a title element on the previous page, again using the “request parameter” dynamic option and again also choosing GET and setting the parameter name (query var key) to “color”.
Go ahead and click submit and see.