Display a list in a Repeating Group

A repeating group can be used to display a list of items. Some examples include job applications, products, tasks, images, files, etc.

It is important to remember that it should be a list of items.

This Bubble tutorial will guide you through the steps of creating a repeating group and displaying a list.

What is a Repeating Group in Bubble?

A Repeating Group is a container used to show a collection of items that you want to show or hide together.

It is utilised when you need to display multiple items of the same data type.

The list of things can come from your Bubble app's database or an API response.

When to avoid using a Repeating group

If you want to show an individual item, use a group container. If you're going to indicate the number of items in a list and the total number of items in the list, you can use a numeric field. When you want to show a series of items, you use a repeating group.

I am emphasizing this because you should structure your Bubble application so that you use repeating groups as little as possible. There is nothing inherently wrong with repeating groups, but they can slow down page speed if not used correctly.

Setting up a Repeating Group

To configure a repeating group, we need to define 2 things.

Type of content
Data source

Type of content

It defines the content type of the container. It can either be a data type of your Bubble application or a text, number, etc. It is generally a data type that you've created.

The most important thing is that the Data source must be of the same Type as the content you define.

Data source

Here you'll define from where the information to display in the repeating group. You can pull in information from

A data type of your application using "Do a Search"
External API using "Get data from external API"

It can also be a field whose type is a list of things.

Something like this. A list of texts in each entry

Displaying data in a repeating group

A repeating group will show each database entry in each cell.To see all the entries in a repeating group, select the appropriate Type of content and Data source as described above.

Type of content is a Data type

To begin with, we'll first load the names of all the Users of our Bubble app in a repeating group.The Type of content will be Users as we're pulling in information from the Users table.As we're pulling information from Bubble's database itself and not from an external API, the Data source will be "Do a Search for".

You can add constraints if you'd like to filter the data. With Constraints, you can tell Bubble to only return results which match a certain criteria. For example, we can put a constraint to return only those users who's Active status is Yes and the Paying member field is set to Yes.

Once you've defined the Data source and Type of content of your repeating group, you simple need to create the UI/visual elements to display the results.

I've place a text field inside the first cell of the repeating group. You can then show any information of that cell's user inside the text field using Dynamic data.

Type of content is text, number, image etc

There are cases where you can instead of having the Type of content as a Data type, you can have it as text, number, image, date etc. In such cases, there is a slight change in the way you define the Data source of your repeating group.

One example of such a scenario is when you are storing a List of text in the User table. I have a Notes field in the User table which is a list of texts.

To display these Notes in repeating group, I am defining the Type of content as text while the Data source will be a Do a Search for and I'll add Notes field after Do a Search for. This is needed because the Type of content (text in this case) has to match with Data source's content type. As Notes field has a Content type of text, we'll add Notes to the Data source.

Editor - https://bubble.io/page?type=page&name=list_in_rg&id=nocodeassistant-tutorials&tab=tabs-1

Preview - https://nocodeassistant-tutorials.bubbleapps.io/version-test/list_in_rg

If you need some help with your Bubble app or if you need a team of Bubble developers to build a Bubble app for you, reach out to me at [email protected]. You can also follow me on Twitter.