This feature allows users to dynamically add multiple sets of fields to the form, making it ideal for capturing information that may vary in quantity, such as multiple items, services, or participants.
These repeating fields can include various input types, such as text fields, checkboxes, radio buttons, or dropdown menus. Users can dynamically add or remove sets of these fields as needed, allowing for a flexible and customizable form experience.
Table of contents:
Plugin Installation
Download it here: https://add-ons.org/plugin/elementor-forms-repeater-fields/
Once you’ve downloaded a plugin, you’ll need to install it on your website. Log into your WordPress admin dashboard. Navigate to the “Plugins” section and click on “Add New.” Search for the plugin by name and click “Install Now” once you find it.
After installation, click on “Activate” to activate the plugin.
How to build repeatable blocks of fields?
Simply set the Repeater Start Field as the Field Type of the item number you want to be the start of your repeaters, and every next item, until the Repeater End Field is chosen, will become a repeatable item.
E.g: If you want to repeat the Guest Field (including first name, last name, age, phone). You put Repeater Start above the First name field and Repeater End behind the Age field.
Repeater fields settings
How to set the title before each row of the repeater?
At the Repeater Start Field, An optional title before each row of the repeater, change it and show index.
How to limit repeated fields?
It means limiting the number of times fields are repeated.
At the Repeater End Field, put the repetitive number in the “Limit” box
E.g: If you want to repeat the Guest Field up to three times. Put the number 3 in the box
How to show the number of repeated rows at start?
The number of repeater rows to display initially.
At the Repeater End Field, enter the number of repeated rows you want to show first in “Initial rows”
E.g: If you want to display 2 Repeater Field Initially then type the number 2 in the ” Initial Rows” box.
How to change the add button text?
At the Repeater End Field, modify the text in the “Add button text” box
How to send data to email and view the entry
The plugin will auto-add in [all-fields] or you can use the shortcode in tag End Field
View data Submissions
Elementor doesn’t support preview HTML, you can copy HTML in Submission and pate https://htmlcodeeditor.com/
Map Field with Initial Row
You want to be able to set the maximum number of times a row can be repeated to match the quantity entered by the user. ( allows you to automatically show the required fields when the user selects the quantity.)
Step 1: Add a field to your form, it can be Number or Dropdown… to enter values
Step 2: Build repeatable fields
Start by choosing a Repeater Start field.
Insert repeatable fields: Name, Email, File Upload
Finish by dropping a Repeater End field
Step 3: Enable field values to create auto-repeat fields based on the value of field.
You need to copy the field ID of the value field and paste it into the Map Field with Initial Rows at the Repeater End
Save and have a preview: If you select quantity as 2 then 2 guest fields will appear to fill in
That’s it! We hope this article helped you find out how to add Repeater fields to your Elementor forms.
Can this be used for editing and deleting a repeater field?
Sure,
You can use it.
Thanks