How to Use Query Strings to Pre-Populate Form Fields From Another Form

Introduction

Do you want to pre-populate form fields with information pulled from another form? Not only does this insure accuracy between forms but it also saves your visitors time, allowing for higher conversions. In this tutorial, we’ll show you how to pass through information from one form to another by using pre-populated query strings.

Creating your forms

We’ll start by creating two separate forms. If you need any help in creating forms, please see this documentation.

Creating the homepage form

First, create your first form and add all of your fields to this form.

For now, click Save. We’ll be coming back to this form in another step.

Creating an additional form

Next, create an additional form with the fields you need which will include the fields you want to pre-populate.

Once you’ve completed adding your fields, under Settings » General tab, click the Advanced options so that you can toggle the button to Enable Prefill By URL.

Setting up the URL Redirect on form submission

Now it’s time to pull it all together. Edit the homepage form you created in the first step and go to the Settings » Confirmation section.

Change the Confirmation Type to Go To URL (Redirect) and in the Confirmation Redirect URL field, copy and paste this URL.

http://my-example-site.com/quote/?wpf1036_1={field_id="1"}&wpf1036_2={field_id="2"}

With that URL above, there will be some things you’ll need to change. Such as:

1. my-example-site.com – this needs to be changed to match your site’s domain name.
2. quote – this needs to be changed to match the page name you’ve added your more detailed form to.
3. wpf1036_1={field_id="1"} – the 1036 is the form ID for the second form and the _1 is the field ID for the email address field. You’ll need to update both of these to match the form ID for the second form and the field ID for the second form that contains the Name field
4. {field_id="1"} – this will need to be changed to match the field ID number from your first form for the Name field.

If you need help finding your specific field ID numbers, take a look at this tutorial.

Once you’ve added that to your Confirmation Redirect URL, click Save on the form.

Now when users see the homepage form, they can fill in their name and email address and when they click the Submit button, the page will redirect to another form that will automatically pre-populate the Name and Email Address fields with the information collected from the form on your homepage.

And that’s all you need to use a query string to pre-populate your form fields. Would you like to see what other fields you can use this with? Take a look at our documentation on How to Enable Prefill By URL Setting in WPForms.

FAQ

Q: Why isn’t it pre-populating the next form?

A: If you notice that your fields aren’t pre-populating, please check that on your second form, you have enabled the setting.

Open the form builder of the second form and on the General tab, click the Advanced towards the bottom of your screen and toggle the button to Enable Prefill By URL.

Q: What do I do if I’m using a first and last name for my name field?

A: If you’re not using the Simple format for your name, you would just list out your name field in the URL like this.

http://my-example-site.com/quote/?wpf1036_1|first={field_id="1|first"}&wpf1036_1|last={field_id="1|last"}&wpf1036_2={field_id="2"}

The same can be said for the address, your format for breaking down the address would appear like this.

&wpf1036_3|address1={field_id="3|address1"}&wpf1036_3|address2={field_id="3|address2"}&wpf1036_3|city={field_id="3|city"}&wpf1036_3|state={field_id="3|state"}&wpf1036_3|postal={field_id="3|postal"}