Collecting Repeatable Data in WordPress Forms

Collecting repeatable data is a frequent need when building WordPress forms. Whether you're registering players for a team, recording employees working for a company, or purchasing multiple configurable products on a single checkout form you'll need a way to collect repeatable data.

In this article, we'll show you an effortless way to obtain and work with repeatable data and fields by utilizing Gravity Forms and the 3rd-party plugin, GF Nested Forms by Gravity Wiz.

The Scenario

Let's work with the first example. We're registering players for a soccer team. Sorry, I'm American. I agree "football" is a much better word for the sport.

We need to collect some information about the team and some information about each player on the team. If we only need to obtain a small amount of very simple data (e.g., player name, email and jersey number), we could just use a List field and call it a day. Sure, the simple inputs would not validate that the Email is a valid email address and the Jersey Number is, in fact, a number, but it's a workable solution.

What if we need to collect a more robust set of data for each player? The List field just won't cut it.

Solution? Gravity Forms Nested Forms.

Getting Started

Hi, I'm Dave, the lead developer at Gravity Wiz and a core Gravity Forms developer. I developed Gravity Forms Nested Forms as a solution for folks wanting to collect complex repeatable data with near full support for all Gravity Forms' core functionality.

GF Nested Forms is part of Gravity Perks, a suite of over 29 premium Gravity Forms add-ons. If you're not already a Gravity Perks user, pick up a copy now and join thousands of delighted customers who find new ways Gravity Perks can help them every day.

Let's dive in and see exactly how GF Nested Forms will work as a powerful repeater, registering players for our team.

Creating a Player Registration Form

We'll start by creating a player registration form. This form will have all of the details we want to collect for each player.

• Name (Name field)
• Address (Address field)
• Profile Image (File Upload field)
• Jersey Number (Number field)
• Jersey Size (Drop Down field)

Creating a Team Registration Form

Now let's create a form called Team Registration. This form will have all of the details we want to collect for the team.

- Team Name (Single Line Text field)
- Team City (Drop Down field)
- League (Drop Down field)
- Players (Nested Form field)

Configuring Your Nested Form Field

Ready for the fun part?! The Nested Form field allows you to select another form which will be used to collect data and attach it to the current forms' submissions. How does this work? Clicking the Add Entry button will load the nested form in a modal (a pop-up inside the current window). After submitting the nested form, a child entry is created and attached to the parent submission.

Go ahead and open up the field settings for the Nested Form and let's get it configured.

1. Select the "Player Registration" form in the Nested Form setting.
   This will cause the Display Fields setting to appear.
2. Select a few of the most important, identifying fields in the Display Fields setting.
   You don't want to crowd your parent form with too much information. One of the nice things about Nested Forms is the separation of information. When using fields that can be easily repeated, the user only sees what they need to, and nothing that they don't. As forms become simpler, they become easier to maintain and can even increase your conversion rates.
3. Change the Entry Labels to "Player" and "Players".
   The Entry Labels will be used through the Nested Form field settings to better identify what the nested entry represents (in this case, a player).

Take It for a Spin

In it's simplest form (pun intended?), we're done. Here is a simplified demo from the Nested Forms documentation:

Simplified Demo

Doing Cool Stuff with Nested Entries

Let's take our example even further (and a moment to appreciate how compelling that last headline was).

Registering Multiple Users

We want to register each player as a WordPress user on the website so they can edit their own profile. Easy enough.

On the Player Registration form, we'll use the Gravity Forms User Registration add-on to add a "Create User" feed so that a user will be registered every time the form is submitted. We'll assume you already are familiar with feed-based add-ons but if not, here's a full walkthrough of this process.

GF Nested Forms handles ensuring nested form submissions will not trigger feeds until after the parent form has been submitted. This means the players won't be registered as WordPress users until after the Team Registration form has been submitted successfully.

Charge for Nested Entries

Another cool thing you can do with nested entries is to use them in Gravity Forms calculations. If we wanted to charge a small fee for each player registration, we could handle this on the Team Registration form.

1. Add a Product field to the Team Registration form.
2. Set the Field Type to Calculated.
3. Set the Formula setting to the Nested Form field merge tag with our special :count modifier multiplied by whatever fee you would like to charge per player.
   For example, if you want to count the number of players submitted (the nested field in our example has a field ID of 5) multiply it by 10, your merge tag would look something like this:
   {Players:5:count} * 10

Whenever someone is adding a new player, the field total will increase by $10.

Want to see it in action? Check out the demo.

For more ways you can use nested entries in Gravity Forms calculations, check out the docs on Gravity Wiz.

Powerful, Flexible, Repeatable Data Collection

These examples just scratch the surface of what is possible with this powerful plugin. GF Nested Forms is the most advanced repeater solution available for the world's most powerful WordPress form plugin, Gravity Forms.

Have a question about using Nested Forms to power your next project? Leave a comment below and I'll be happy to advise.