Toggling Favorite Icon

Trying to set up an image element to load 1 of 2 images (a star vs a filled star) based on a yes / no field in the database. Think I have that working, but I also want that image to be a click toggle that changes the yes / no field in the database.

How can I create this toggle event?

@aflow86 does this page do what you want?

Pretty simple, especially if you’re happy to use Bubble’s trick for embedding FontAwesome icons in a text element–then you don’t even need to mess with an image element. But same logic as below would apply if you use an image vs. text element.

Just use a text element with the fa-star and fa-star-o conditionalized as below:

Then, in your workflow, set 2 conditional events for when that text element with the star is clicked, based on the y/n value of the db field you want to toggle. In my example below, I have a “featured” field on the Item type that is true/false:

1 Like

Thanks for sharing this tip.

1 Like

I’m currently using the star on a dropdown selector, so I’ll have to play around with the logic to test it. I’m not sure it’ll work the exact same way though.

Didn’t work for me. The icon doesn’t change colors upon click…

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