Whole Cell Link in Repeating Groups in Bubble.io

In this Bubble tutorial video we show you quick trick for working with repeating groups in Bubble.io - that being how to make the whole cell clickable and run a workflow action.

Ask a question

Subscribe
Notify of
guest
0 Comments
Inline Feedbacks
View all Q&As

How can I turn everything in a cell in a repeating group in Bubble into a clickable link? For example, I've got my repeating group here of contacts and I want to make it so that if Bruce is clicked or USA is clicked or if anywhere in this box is clicked, I go through to a page all about Bruce.

Using groups to group elements

If I look in my Bubble editor, you can see I've got my two text elements here and I think the easy mistake to make would be to think "oh I've got to add a workflow to each of them. But that isn't lean development, that's going to cause you a whole load of headaches later on, it increases the chance of you neglecting or forgetting to update a particular part of your app. We want to create one workflow to do one thing if that's all we need. So all you do is, I'm holding shift and I'm going to click on all of the elements in the row, right click and say group in row. And then I'm going to set the layout of my repeating group. Notice I've... not my repeating group in my repeating group. I've now got a group. This is basically the template for every cell in my repeating group. It is my first cell and it is the template for all of them. And so I'm going to say here width 100% and then I'll go to workflow. In actual fact, on the group I'll say add workflow and we'll say "go to page" and I have a page set up for this, "contact", "current sales", "contact", and we'll preview that. By now putting my mouse over you can see how much of it's turned to a link or is at least clickable. And so yeah, "Bruce USA is clickable but not the whole height of the cell". How do I fix that? Well let's go back into design and all I need to do is tell my group that is containing everything in my repeating group to set a fixed height of 100%. We'll go back to my demo, refresh it, and now look at my mouse the whole height of the cell is clickable. If you're learning Bubble and this video has been useful please like and subscribe and we've got hundreds of Bubble tutorial videos, more than you can find even on our YouTube channel exclusive to our members at planetnoco.com See you next time!

Latest videos

lock