Repeating group "if/then" type question

Newb question re repeating groups. If I have a column with numbers 1 through 4 and I want to display star icons (like a rating) instead of the number, how do I do that?

Thanks!

You can check the Bootstrap Star Rating Input plugin.

I tried that plugin and it works differently than what I need, plus I couldn’t get it to work in a repeating group.

A possible approach if the existing Start Rating does not work for you, and assuming the data is already there, you can create four icons (a star or something that you like) and play with their conditional visibility.
I created a one-pager test to illustrate what I mean.
The data is taken from the table STAR RATING.

For some reason I can’t publish the link with my example. it goes to my home page instead of to the example. Give me a bit.

OK, I’m probably doing something silly with the links, so I’ll try to cut and paste pics of what I did.

This is the page with the Repeating Group. The search goes to the table “STAR RATING” used for this example, that has only two fields: Label (a text) and Rating (a number). Your data will probably be different.

I assume you already know that the RG uses the variable Current Cell to display values in each row. If you don’t understand this part well, you may want to go over the tutorials and Bubble manuals. This is a fundamental concept to understand when using Repeating Groups.

In the top row of the repeating group is where you put the fields that you want repeated. In this case I’s showing the label and the rating directly from the table and 4 icons.
The two fields to the left are text fields that will display the two fields in my STAR RATING table. here’s one of them:

In each of the four stars, I play with the conditional tab. YOu will see two conditions:
One to change the default colour of the icon to a light gray whenever the icon is visible and the other to change it to amber when the star needs to be “added”

This simply uses a rating from 0 to 4 but you may want to change the conditions to anything that best suits your needs. In my case, I change the second conditional in each subsequent star to change the icon color to amber when the Current Cell’s STAR RATING’s Rating is > 0, or > 1 or > 2 or > 3.

I don’t want to overly elaborate so if this is not very clear, just write me back.

This is how my page looks like once you preview it:

Hope this helps getting you going with Bubble,

Alex

2 Likes

Thanks! This was hugely helpful. :grinning:

This topic was automatically closed after 70 days. New replies are no longer allowed.