Option sets as selections on user sign up?

[Orbit]

Hello Bubble!

I’m working on a feature where users can select the cities they are interested in, such as New York, London, etc., from a repeating group populated with options sets during the sign-up process.

Here’s what I’m trying to achieve:

• When a user selects a city, it should be highlighted with a background color. If they click on the city again, it should be unmarked.
• Upon clicking the “Next” button, the selected options should be saved to the user’s profile.

Could you please guide me on the best approach to implement this?

Thank you!

[hergin]

You can do it by using custom states, a repeating group and conditionals. See below for a demo:

• Here is the option set:

  • 

• A repeating group display all options of it:

  • 

• When you click on a cell, it updates a custom state on the page:

  • 

• And conditionally change something:

  • 

Here is the editor if you want to see for yourself: Tests for Forum 14 | Bubble Editor

[Orbit]

Thank you @hergin! But how do i select more than one? And how to i unselect one if say a user clicks the wrong one?

Also storing the cities on the users should that me done once they press a city or when clicking to next page?

[hergin]

@Orbit

Thank you @hergin! But how do i select more than one? And how to i unselect one if say a user clicks the wrong one?

You can make the custom state a list of City so multiple can be selected. Then, you will update the conditions etc according to that.

You can also check Multiselect dropdown so users can select multiple things immediately without you doing a lot of work if that fits your app (find it in plugins) very easy to use:

@Orbit

Also storing the cities on the users should that me done once they press a city or when clicking to next page?

This is up to you and your design. Both are possible and OK.