How to Enable Prefill By URL Setting in WPForms

Are you looking to streamline the user experience on your website with the WPForms Enable Prefill By URL setting? Pre-filling form fields based on previous interactions? Harnessing the power of query strings to auto-populate form fields from one form to another can significantly enhance user convenience and efficiency.

Imagine a scenario where a user has already provided certain information on one form, and you want to carry over that data seamlessly to another form without requiring them to re-enter it. By utilizing query strings, you can achieve precisely that, creating a smoother and more personalized journey for your visitors.

For a step-by-step tutorial of this functionality in action which includes creating the 2 forms and passing information from one form to another, take a look at this article.

In this tutorial, we’re going to focus more on explaining the field types and how these look in query strings to empower you to make your prefilled forms

Enabling the Prefill By URL

Before we can start prefilling our form fields, we must first enable this option within our form to accept these prefilled parameters from another form.

To achieve this you’ll need to first create a new form or edit one of your forms. Next, navigate to Settings » General from within the form builder and inside the Advanced options, toggle the option labeled Enable Prefill By URL to enable this.

Assembling the URL

Next, you’ll need to construct a URL with a query string, utilizing GET parameters to pinpoint a specific field and include the corresponding value. Interestingly, the field type becomes irrelevant in this process. Regardless of the field type, all query strings for enabling prefill by URL in WPForms adhere to a consistent structure. For instance, consider the following URL with the fundamental query string format:

http://test.com?wpf20_1_subfield=value

• ?wpf: Marks the beginning of a query string for WPForms’ prefill by URL setting.
• Form ID: Identifies the targeted form (in the provided URL, the Form ID is 20).
• Field ID: Specifies the intended field within the form (in the given URL, the Field ID is 1).
• Subfield Identifier (Optional): Utilized solely when targeting a subfield, like the City subfield within an Address field (in the example URL, it’s simply labeled as “subfield”).
• = (Equals Sign): Signals the commencement of the value.
• Value: Represents the desired value to be added or selected for a field. Any spaces should be substituted with %20.

Using the prefill setting

In the tutorial link above, the idea is to have your visitor see the first form and complete some basic information. Then pass that information on to another form with the Submit button.

In order to achieve that, you’d need to set up your Confirmation Type to Go to URL (Redirect) and use this setting for the fields above to populate that query string.

An example is adding this URL to the Redirect URL. http://mydomain.com/contact?contact-reason=Events%20and%20Parties

And that’s it! For another specific example of this in action, check out this tutorial on How to Use Query Strings to Pre-Populate Form Fields From Another Form. For other examples, please check out our article on How to Use Query Strings to Auto-Fill a Text Field.

Using Conditional Logic with this setting

When utilizing conditional logic alongside the prefill setting, the functionality will operate seamlessly. Conditional fields will still hide or display based on the values populated via prefilling. It’s important to note that conditional logic is applied after fields have been dynamically filled, ensuring that your forms continue to function as expected.

Query String Examples for Specific Fields

For more advanced users, this table below offers examples illustrating how to configure GET parameters for each field type. Additionally, if a field offers various formatting options, specific examples for those alternatives are also included.

Single Line Text

Paragraph

Dropdown

Multiple Choice

Checkboxes

Numbers

Name

Email

GDPR Agreement

Website / URL

Address

Password

Phone

Date / Time

Hidden

HTML

File Upload

Page Break

Section Divider

Rating

Captcha

Signature

Likert Scale

Net Promoter Score

Payment Coupon

Single Item

Multiple Items

Dropdown Items

Credit Card

Total

FAQ

Q: How do I use this for sublabels?

A: When using this to pre-populate a Name or Address field that could have several subfields, we’d like to share an example with you.

?wpf1036_1|first={field_id="1|first"}&wpf1036_1|last={field_id="1|last"}&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"}

Reference Artciles

• For details on how to locate a Form ID or Field ID, please see our tutorial.
• As a general rule, the maximum length for a URL is 2,000 characters.