Creating Data Repeaters

Overview

A Repeater Form Control, also known as a Data Repeater, is a custom user-defined Form Control that can be added to a Form to display or manipulate specified Input and Output data. A Repeater Form Control can be used in cases where the user needs to add or remove items from a list of entities shown on the Form such as an invoice or an inventory tracking Form. 

A Data Repeater functions with the aide of two Buttons components: Data Repeater Add Button and Data Repeater Remove Button. These components allow the end user to add another line item and remove the selected line item respectively. 

Important Repeater Properties

Data Repeaters contain specific properties customized to the needs of Designers wishing to implement this component. The following subsection briefs each property listed in the screenshot below.

Example

In this example, a Data Repeater Form Control will be created, then it will be added to a Form and displayed for the end-user. The Data Repeater will populate a list of Accounts and give the end-user a visual representation of selected line items, and also allow them to add or remove accounts through the Form.

Create Repeater Control

1. In a Designer Folder, select the CREATE FORM button. 
2. When the Create Form dialog appears, select the Data Repeater section on the left. 
3. Choose Repeater Control, name the Form then select CREATE.
4. In the Form Designer, locate the Form Data section of the Properties panel.
5. Select Pick under the Input Type selector.
6. Enter 'Account' into the search bar and select the top result.
7. Select the Data panel on the right-hand side of the workspace.
8. Expand Form Data.
9. Locate the EmailAddress property, then drag it onto the Form.
10. Select the option to define this property as a Text Box.
11. Save and close the Form Designer.

Use Repeater Control

1. In the Designer Folder, select the CREATE FLOW button. 
2. Select and name the Default Flow then select CREATE.
3. In the Flow Designer, navigate to the Steps panel, navigate to Integration > Internal Services > AccountService.
4. Select the GetAll step drag and drop it into the workspace. Connect the Start step to the GetAll step.
5. Select the Done outcome path of the GetAll step.
6. In the Add After dialog, select the Show Form step in the Favorite Steps category. Select ADD.
7. With the Show Form step selected, in the Properties panel select Pick or Create Form.
8. Name the Form then select CREATE under Create New.
9. In the Form Controls section, expand User Controls > [Existing User Controls] > [Current Folder].
10. Click and drag the Data Repeater to a grid section. 
11. Set the Data Name to 'Account Data Repeater'.
12. From the Form Controls section, add the Data Repeater Add and Remove Buttons to the Form.
    These button controls allow the user to add or remove Account Entities in the Data Repeater Control input List.
    The added/removed Accounts are not automatically saved in the system. Additional logic will need to be added to the Flow in order to add/remove Accounts to the System. 
13. Add a Button from the Favorite Components section of the Form Controls section. Set the name of the Button to "Submit".
14. In the Data Repeater Properties, navigate to the drop-down list for Selection Type. Pick Visual Indicator.
15. Leave the Default settings for color and size as the default configuration.
    Alternative Selection Types

    The Line Number option performs the function of a Visual Indicator with the addition of a number inserted into the color bar.
    The None option shows no selection indicator.
    
    

    Short Key Set-Up

    The Move Up Shortcut Key and Move Down Shortcut Key allow users to specify a custom key to move the selected line indicator up or down.

16. Under Input Data, select the corresponding Add/Remove buttons from each dropdown list.
17. Save and close the Form Designer.
18. In the Flow Designer, select the Show Form step.
19. Under Inputs > selected Account Data Repeater Control, set the mapping type to Ignore.
20. Under Inputs > Account Data Repeater Control, select Pick. 
21. In the Pick Data for Input dialog, choose GetAll_Output.
22. Connect the path from the Show Form step to the End step.

Debugging and Troubleshooting

For debugging purposes, it is helpful to provide an additional step to view the changed list of accounts. This will help users troubleshoot the Add or Remove buttons.

1. In the Steps panel, expand Data > List.
2. Add an Add Items to List step to the 'Submit' path of the Show Form step.
3. Select the Add Items to List step and navigate to its Properties tab.
4. Under Inputs > New Items, select Pick. 
5. Choose Account Data Repeater.All EmailAddress.
6. Under Inputs > Original List, change the mapping type to Ignore.
7. Select the Debug link located in the top toolbar.
8. The Form that holds the Repeater Control where the list of Accounts that the Repeater pulls in is displayed.
   1. The Visual Indicator shows that selecting a line item will change the color of the bar to the left, as configured in the settings for the Repeater Form Control.
   2. Using the Add button at any point will create an Email Address box with a text box where the email is entered.
   3. Using the Remove button on a selected line item removes the account from the list.
9. Select the Submit button to apply the changes.
10. Select View Input/Output Data on the Add Items to List step to see the new list of Emails.
    The Data Repeater automatically updates or refreshes when records are added individually.