How to allow only one choice in a set of radio buttons inside of a repeating group?

In bubble, I have a repeating group. The repeating group has a data source associated with it to filter a list of 2 options. Inside the repeating group, I have a set of radio buttons. These buttons have been set up to show in their own cells by designing the repeating group as one column and one row. The choices source for the radio buttons uses the :converted to list operator to make this happen. So, it’s one repeating group with one set of radio buttons. Now, I have my radio buttons and data set up the way that I need them to be for the UI. But, The user is still able to select both options, when they should only be able to select one radio button option at a time. How can I make it so that only one of these radio buttons is able to be clicked at a time?

This calls for a custom radio button structure. See demo below:
chrome_QVXM5bt7j1

It is simply, a custom state that keeps the selected value of the repeating group:

When, the icon (radio looking thing is an icon) is clicked, you set current cell’s thing as selected:
image

And conditionally, change the icon:
image

Here is the editor if you want to check details: Tests for Forum 11 | Bubble Editor

2 Likes

Amazing! I’ve been searching for days how to do custom radio buttons. Thank you for Bubble file especially.

1 Like