Forum Academy Marketplace Showcase Pricing Features

Pushing dynamic data to the HTML (Repeating Group)?

Need help Database
#1

Hey guys,

So I want to push the dynamic data of each cell of RG with HTML/CSS element, to achieve different gradients for each Group in the Repeating Group:

image

The HTML file is nested into the Repeating Group cell. But the issue is that it does not change all the backgrounds dynamically - it changes them all to a single color:

image

Where am I making a mistake? I would very much appreciate someone helping me solve this issue as I’ve been searching over the internet but didn’t find something that could help me…

Best regards,
T

#2

Hello!

You shouldn’t need an HTML element to achieve this functionality - you can set the group’s background style to gradient in the bubble inspector, and then enter dynamic colors into the starting color and ending color fields.

#3

Hey @sam.morgan , thanks for your reply.

The thing is that the basic Bubble gradient editor does not provide with a bit “complex” design features, so I would need to implement it this way (with CSS) to get the results.

Do you have an idea on how could I achieve it this way with HTML/CSS?

#4

Unfortunately, I don’t - custom code is outside of the scope of our support, but hopefully some other users on the forum here have answers for that solution!

#5

Hey @petrovic.teodor :wave:

Do you have the ID Attributes enabled?

#6

Hey @J805 , yes of course - and it’s linked to the group that should be colored gradient. :slight_smile: It is expected that each group in repeating group is colored differently, but it colors them all the same (purple like on the example)

#7

@petrovic.teodor Ok good. :white_check_mark:

Next, what is the name of your attribute in your code above?

It would be helpful if you share a screenshot of the element’s ID attribute too.

1 Like
#8

Hello @J805 ,

So the ID that I’m using as shown in the screenshot is #RoleGradient.

Attached is the screenshot of how it is applied to the group which belongs to the repeating group:
image

I can tell it is successfully applied because it successfully changes the group’s gradient. But the dynamic part is what is not working (it’s not pulling each cell’s dynamic data and changing each cell to a correct gradient color).

#9

Ok. Cool. :white_check_mark:

Next, for the ID Attribute. At the end use dynamic data and do current cells index. No spaces, underscores or dashes should be ok.

Do the same thing in the code.

At the moment, all the items inside the repeating group have the same ID. That’s why they are all the same color. By adding current cells index, each will have a unique id attribute instead.

Let me know if that works. :blush:

@j805 www.NoCodeMinute.com

For All Your No-Code Education Needs:

1 Like
#10

@J805 , it worked, and I’ve unlocked a new skill when it comes to Bubble. Thanks a lot! :slight_smile:

1 Like
#11

Awesome. Glad it helped. :blush: