Create and Update Records With a Repeater
Learning Objectives
After completing this unit, you’ll be able to:
- Create multiple records at once on a flow screen with a Repeater component.
- Configure a repeater and its fields to display and edit records.
Let’s walk through another use case, where a loop is necessary but requires more steps to implement.
Perform Multiple Data Actions on One Screen with a Repeater
The sales reps at Pyroclastic, Inc. frequently visit new prospects. Their first meetings always start slowly as the sales rep has to ask each meeting attendee for their information, one by one, so they can create and update contact records for each attendee. The process is made even more tedious by all of the clicking and page loading. You’ve been asked to create an interface that speeds things up and keeps these critical sales engagements flowing.
Fortunately, the Repeater screen component is designed for this use case. It allows users to rapidly enter and update chunks of data, all in one screen. Let’s create a flow that runs from a button on the account, displays that account’s existing contacts and allows you to create more contacts on that account.
When the Repeater component runs on a screen, it displays the collected records that you define and a series of fields. When the user clicks the Add button, it adds another set of those fields to the screen. The user can continue clicking Add to define as many records as they wish.
Create a Screen Flow and Get the Existing Contacts
First, create the flow. Then use a variable to receive the current account’s ID. After that, create a Get Records element to retrieve the account’s existing contacts.
- Create a screen flow.
- Create a variable to store the current account’s ID.
- For Resource Type, select Variable.
- For API Name, enter
varAccountID
.
- For Data Type, select Text.
- For Availability Outside the Flow, select Available for input.
- Click Done.
- For Resource Type, select Variable.
- On the flow canvas, create a Get Records element.
- For Label, enter
Get Existing Contacts
.
The API Name should auto-populate asGet_Existing_Contacts
.
- For Object, select Contact.
- For Condition Requirements, select All Conditions Are Met (AND).
- For Field, select Account ID.
- For Operator, select Equals.
- For Value, select varAccountID.
- For How Many Records to Store, select All records.
- For Label, enter
- Save the flow.
- For Flow Label, enter
Mass Create & Update Contacts
.
The Flow API Name should auto-populate asMass_Create_Update_Contacts
.
- For Flow Label, enter
Create a Screen with Repeating Fields
Next, create a screen with a Repeater component containing the contact fields that you want to capture. Make sure you set each field’s default value to reflect the existing contacts you retrieved.
- After the Get Existing Contacts element, add a Screen element.
- For Label, enter
Get Details
.
The API Name should auto-populate asGet_Details
.
- For Label, enter
- On the screen canvas, scroll down to the Display section of the Components list, and add a Repeater component.
- For API Name, enter
ContactRepeater
.
- For API Name, enter
- Drag Name from the Components list to the “Drag components to include in the repeater here” box in the Repeater component.
The repeater repeats only the components that it contains, so make sure you drag components into the repeater. For this first component, you should see the “Drag components to include in the repeater here” box turn green when you’re dragging the component to the right spot.- For API Name, enter
Name
.
- Leave the other fields as default for now.
- For API Name, enter
- Drag Text from the Components list to the Repeater component.
You should see the repeater’s contained components (currently, just the Name component) turn green when you’re dragging the text component to the right spot.- For Label, enter
Title
.
The API Name should auto-populate asTitle
.
- Leave the other fields as default for now.
- For Label, enter
- Drag Email from the Components list to the Repeater component.
- For API Name, enter
Email
.
- Make sure the Label is
Email
.
- Leave the other fields as default for now.
- For API Name, enter
- Drag Phone from the Components list to the Repeater component.
- For API Name, enter
Business_Phone
.
- For Label, enter
Business Phone
.
- Leave the other fields as default for now.
- For API Name, enter
- Save the flow.
You can visually confirm that the fields are all in the repeater by making sure they’re all above the Remove button and within the repeater’s boundary box.
That’s all the fields needed for now. But the fields need a bit more configuration to make them work well with the Repeater component.
Configure Default Field Values for Existing Records
These screen components aren’t just for creating new contacts. We want to use these screen components to edit existing contacts too, but the flow doesn’t know that. Even though the flow will eventually contain elements that push the inputted data to contact records, the flow still won’t understand that these components represent actual record fields. You must tell the repeater that its contained components correspond to a specific collection variable, and you must tell each component which field it corresponds to. When these settings are configured, then the flow knows where to display each field value that it gets from those existing contacts.
This field-to-component mapping is done in each component’s Default Value field. After you tell the repeater which collection variable contains its prepopulated items, components can access the prepopulated data through a section called Repeater Prepopulated Items.
The Repeater Prepopulated Items section appears only when selecting a value for a component that’s contained in a repeater, and only if you’ve configured a data source for that repeater. This section accesses the flow’s collection variables, such as the contacts retrieved by the Get Existing Contacts element, so you can use a collection’s values in the repeater’s components. When the flow runs the screen, the repeater prepopulates one set of components for each item in the collection. You can then configure the flow so that when the user makes changes to those existing records in the screen, the flow saves those changes back to the records.
Let’s configure the repeater and the components’ default values now.
- On the screen canvas, select the Repeater component that contains the other components.
To select the repeater, click the area near the Add button. You know you’re hovering over the right place to click when there’s a blue box surrounding its contained components.
- In the Repeater configuration panel, click Configure Data Source.
- For Collection for Prepopulated Items, select Contacts from Get_Existing_Contacts.
This field tells the repeater which collection contains the existing records that you want to display inside the repeater.
- For Collection for Prepopulated Items, select Contacts from Get_Existing_Contacts.
- On the screen canvas, select the Name component.
- In the Name component’s properties, in the First Name field, scroll to the Repeater Prepopulated Items section.
- Select Contacts from Get_Existing_Contacts, then select FirstName.
- In the Last Name field, select Contacts from Get_Existing_Contacts from the Repeater Prepopulated Items section, then select LastName.
- In the Name component’s properties, in the First Name field, scroll to the Repeater Prepopulated Items section.
- On the screen canvas, select the Title component.
- For Default Value, select Contacts from Get_Existing_Contacts, then select Title.
- For Default Value, select Contacts from Get_Existing_Contacts, then select Title.
- On the screen canvas, select the Email component.
- For Value, select Contacts from Get_Existing_Contacts, then select Email.
In some components’ properties, the Value field works the same as the Default Value field found in other components. If you’re uncertain what a component’s field does, hover over theicon adjacent to that field for more information.
- For Value, select Contacts from Get_Existing_Contacts, then select Email.
- On the screen canvas, select the Business Phone component.
- For Value, select Contacts from Get_Existing_Contacts, then select Phone.
- For Value, select Contacts from Get_Existing_Contacts, then select Phone.
- Click Done.
- Save the flow.
That’s it for the screen portion of this flow. In the next unit, you build the loop and its Assignment element to add them to a collection variable.