DEV Community

Cover image for Display a list of things in Repeating Group in groups - Bubble Development
Atomic Fusion
Atomic Fusion

Posted on

Display a list of things in Repeating Group in groups - Bubble Development

One of the interesting discussions that popped up was the around the need to display a list of users in groups on an RG. Some Bubblers were having trouble getting this to work - displaying ‘each cell’s thing’s list of users: each item’s name’ led to the list of names appearing as a comma separated list.

Have you ever experienced a similar situation in your bubble development? If not, do you know the solution for this?

First, let's first understand the problem statement deeper

Consider the case where you are creating a feature that allows users to create their own groups and you want to show all group members in a list. When you try to do this in your repeating group, all the members are displayed together in a single text element. But, you want to show each member in its own cell.

How can one do this? Let's see some solutions!

Solution! 🔓

Here ‘Equipos’ is the group and ‘miembros’ is members.

All we need in the first repeating group to find the equipo’s and the second repeating group to display each miembro within that equipo.

A quick mock up of this (image taken from the Bubble Forum thread):

Bubble development

Bubble development

You could simply create a Repeating Group with the type ‘Equipos’ and add another Repeating Group with data type Miembro in each cell that displays current cell’s Equipo’s Miembros (users).

Alternatively, you could use Bubble’s :grouped by functionality. This lets you organize a list of things into groups based on the properties of each thing. In this case, it would be a list of Miembros (users) :grouped by Equipos. The Field to group by would be ‘Equipos’ with type of grouping ‘Exact’.

In the example below, Orders are being grouped by City.

With the aggregation property, you could also retrieve the count, sim, product or any other basic mathematical calculation on a field of the list of things within each group.

Summarizing how grouping works:
[List] ——group by—→ [Group1’s List] [Group2’s List] [Group3’s List] …

Bubble development

With that, you’ll have a list of users displayed on Repeating Group without showing them together! 💃

For Further reading:

Case insensitive input for search in Bubble app development

Forum Thread 🪄

Hope this helped. 🔓

Top comments (0)