How to Use the Repeater Component in Screen Flow
The repeater component was one of the important functionalities flow developers asked for in screen flows. When processing sophisticated forms, you eventually face use cases where the user needs to open multiple cases, add multiple products, or add multiple family members. Until Summer ’24 (now generally available), we turned to form solutions inside and outside AppExchange to allow the users to add multiple records on the same screen. Sure, we had workarounds, but the out-of-the-box workarounds required the user to complete the same task on numerous screens.
What Does The Repeater Component Do?
The repeater is a component you can add to your screen element that houses various data entry components. The component comes with two buttons: Add and remove. When the user clicks the add button, the component displays another set of input fields. When the user clicks the remove button the component removes one set of fields on the bottom. Using this component, the user can enter information into multiple record fields on the same screen .
Where Is This Information Stored?
The flow stores user input for the Repeater in the AllItems attribute of the component.
How Do You Process This Input?
You can loop over the items in this collection to create a collection variable that you can use later in the flow.
Use Case
Let’s build a flow that allows the user to enter multiple cases on one of the tabs of the account screen. Accounts in this example own various assets that the Salesforce Org services. When the customer calls for a complaint or maintenance request, the Salesforce user needs to open a separate case for each asset that needs to be serviced.
How Does The Flow Look?
We have one single screen in this flow other than the success and fault screens. The repeater component is on this screen, and accepts critical input from the user to open the cases. The account lookup is set up behind the scenes. The asset and contact lookups are set by the user in the repeater component.
Then the flow loops all items coming from the repeater component and assigns the values for each case to a case record variable. Each case record variable is added to a collection in each iteration. At the end of the loop, one element creates all the cases in the collection.
Prefill Functionality in the Repeater Component
The repeater component also supports prefill functionality, which allows you to populate the input fields with existing data before the user interacts with the screen. This is particularly useful when you want to display records that already exist—such as pre-existing cases, assets, or contacts—and allow the user to edit or add to them. To use this feature, you can pass a collection of records (like a list of sObjects) into the repeater’s AllItems attribute prior to displaying the screen. Each record in the collection will generate a set of prefilled fields in the repeater component, saving the user time and ensuring consistency with existing data. For example, in our use case, you could prefill the repeater with all assets tied to the account that are due for maintenance, letting the user adjust details or add new cases as needed.
Other Considerations
- Use custom components and all standard generally available screen components as child components.
- Reference the output of a child component in a different child component in a Repeater component.
- Apply conditional field visibility, input validation, and help text.
- When you debug a flow that includes a Repeater component, view information about the component in the debugger.
- Configure the component to react to user input on the same screen.
- This information may be outdated, but the user can add up to 30 sets of fields in the repeater component (as of the previous release when this was released in beta). I cannot imagine why one would need more.
Enjoy
Explore related content:
Flow Tool Kit | Calendar & Scheduling Component
5 Comments