Using Rules to Show Fields Dynamically on a Registration Form

Hey, everyone! In this edition of Tips and Tricks, we’re going to look at how to display a varying number of fields in a registration form. We’ll do that by using Wufoo’s Rule Builder to create dynamic logic in the form.

Suppose we have a registration form where we want to allow multiple people to sign up, but the number could vary between entries. To start out, we’ll put five Name fields in our form, enough for the registrant and up to four additional guests:

But what if someone is registering just two people total? It’d be nice if the form could show the appropriate number of Name fields. So let’s add a new drop-down field and find out how many guests our registrant will be bringing along.

Now that we know the number of fields we should be displaying, let’s go to the Rule Builder and create field rules on our form. For each of the name fields, we want to consider the conditions where the field should be shown.

First off, the ‘Name 1’ field. We know that they’ll always be registering at least one person, so we don’t need a rule for that field—we want it to always show.

For the ‘Name 2’ field, it should be shown if the registrant chooses the option for registering 2 people. But we also want to show the ‘Name 2’ field if they choose 3, 4 or 5 people. For this, we’ll use multiple conditions to create the rule.

Similarly, we only want to display the Name 3 field if the registrant chooses 3, 4 or 5 people.

And we continue on thusly for the Name 4 and 5 fields.

And that’s all there is to it! When our registrant chooses the number of guests, they’ll see the appropriate number of Name fields thanks to our fancy new rules.

if you need to allow for more fields, no worries, this technique can be extended further. Just remember the general concept—start with the field you want to show, and figure out the lowest number where you should show that field. Make a condition based on that number, and continue making conditions for every number higher than that.