1. Helpcenter
  2. Form Builder
  3. How to give your form depth

How to use the repeater element?

  1. Do you want to move data from your dynamic content?
  2. Do you want to add additional information later in the form for dynamic content already entered?
  3. Or do you want to change the layout of the dynamic content in the document compared to your concept?

The repeater element offers a solution for this and makes it possible to copy dynamic content to another location in your form. Each time the user adds a linked dynamic content, the repeater element will also add a block. Here, you can retrieve values back from your dynamic content using scoped aliases. Read more about this in the article "How can you move data within a dynamic content?"

Adding the element


You can find the repeater element in the Form Builder under 'Container'.

repeteer_element_menu_EN

Once you have added the element, you will immediately have the option to edit it in the Form Builder. The following pop-up will appear on the screen.


repeteer_element_instellingen_EN

Global settings


Label and Text
Use a label and text to provide an explanation. This value will be displayed for the user and in the document, unless otherwise specified in the other settings.

Linked dynamic content element
Here, you enter the alias of the dynamic content that you want to link to the repeater element. You can only link one dynamic content to each repeater element. See the article "Using aliases to link data" to learn more about aliases.

Separator

By default, no separator is displayed between the different content blocks. You can set this to a dotted line, a dashed line, or a white space. This will then be added as a standard separator between the different content blocks.

Display settings

Use the buttons on the left side to display the 'Display settings'. You can read more about how to change the display settings of an element in the article "How can I change the display of an element?"

How does it work?

Let's show you how it works with an example. In our example, we will allow the user to add attendees with a dynamic content 'Attendees'. These attendees can then also sign their name using the repeater element. Handy for reports where you want to list all attendees at the beginning of the form and then have them all sign at the end.

Step 1: Start a new concept

A user sees the dynamic content and can add a first attendee.

stap_1_EN

Step 2: Add a first attendee

The user enters a name for the first attendee.

stap_2_EN

Step 3: The repeater element follows the dynamic content

The repeater element recognizes the dynamic content and automatically adds a block in another part of the form.

stap_3_EN

Step 4: Add a second attendee

The user clicks on the '+ Attendee' button to add a second attendee and enters a name.

stap_4_EN

Step 5: The repeater element follows automatically

When finished, both attendees can sign their names in the form.

stap_5_EN

We would like to explain how we built this. Below, you can read what we did.

Dynamic content

First, we need to add working dynamic content. In the article "Using a dynamic content", you can learn everything about how this element works. In the image below, you can see how we set up the dynamic content in the Form Builder.
dynamische_content__EN

Steps to build this in Form Builder

  1. Add a row
  2. Place a container element in the row
  3. Add a row within the container
  4. Place a title element in the row with text 'Attendees'
  5. Click 'OK' to close the pop-up
  6. Add a row below the row with title
  7. Place a dynamic content element in the row
  8. Set 'Number of items when creating' to 1
  9. Set 'Item name' to 'Attendee'
  10. Go to 'Display settings' via the buttons and give alias 'attendees'
  11. Close the screen by clicking 'OK'
  12. Add a row within dynamic content
  13. Place a text field element in the row
  14. Set 'Label' to 'Name'
  15. Set placeholder 'First and last name'
  16. Go to 'Display settings' via buttons and give alias 'name'
  17. Close screen by clicking 'OK'

Repeater


Now we have built a new section with signatures using a repeater element. After adding data, it will look like this:

repeteer_element_EN

Steps to build this in Form Builder

  1. Add a new row
  2. Place a container element in row
  3. Add new row within container
  4. Place same title as for dynamic content and name it 'Signatures'
  5. Add new row below title
  6. Place repeater element here
  7. Under 'Linked dynamic content', enter alias '@attendees'
  8. Click 'OK' to close pop-up
  9. Add new row within repeater element
  10. Place signature field in new row
  11. Set label text 'Signature @.name'
  12. Click 'OK' to close pop-up


It is important to use a point before using scoped aliases (@.name here). This way, only take into account specific names in related dynamic fields.

Tip: You can also retrieve all available elements both in dynamic content and repeater elements. For example, you can transfer photos of receipts from an invoice form to an attachment.