The options are: Beer, Wine, Champagne, and Liquor
A user can select any combination of the above (from nothing to all four types)
They will select the alcohols by clicking respective emojis (see attached image)
The emojis fade opacity or turn bright based on user selection
Based on the emojis selected, I want to capture the list of alcohols in my database and send to an API
What I’ve done
Created the UI + workflows for users to select and de-select alcohol types by clicking the emojis
Created an Option Set: “AlcoholType” with Beer, Wine, Champagne, and Liquor
The AlcoholType Option Set is part of a Data Type called “User Inputs” where I’m also collecting other inputs like how many people there are, whether they are indoors or outdoors, etc.
Where I’m stuck
I can’t figure out how to actually populate the Alcohol option set in my database with the inputs based on emoji selection.
You want to display a list of a “data type” based on if its field for “Alcohol Type” contains the selected “Alcohol Types”? Just “Do A search for User Inputs” where Alcohol Type is in Selected Alcohol Types and display that in a repeating group.
When user click’s on an emoji - add it to a custom state (if you are allowing to select emojis and save the voice with 1 button click at the end) or make a change to a thing (User Inputs) and add clicked emoji to AlcoholType list (if you’d like to save the choice as soon as 1 emoji is clicked)
Can you help me more with the custom state solution? That’s where I want to take this, with toggling things on and off but nothing loads to the database until the button click at the end.
I created a grouped element with type of “AlcoholType” but using the “set state” workflow, it seems I can only set it to one thing at a time. I’d like to “add state” since it’s an option set, but can’t figure that out.
I basically want to do what’s in this video, except add ability to select and de-select multiple options at the same time, which he doesn’t seem to cover.
Thanks a ton for your help - I’m new to Bubble and not a dev by trade.
So, you would like to have a possibility to choose multiple options from “AlcoholType” and save it when? As soon as user select/deselect a single item (beer, wine…) → it should be added to User Inputs? Or user should have an opportunity to select/deselect multiple options and confirm his choice with a button (save/confirm)?
@artemzheg could you elaborate a bit on how to use custom states to achieve this?
The only way I can think is to brute force a bunch of “if statements” that reflect all permutations of alcohols selected. Is there a way to just “add” and “subtract” Beer when Beer is clicked, and same for wine? And then when the final button is clicked, it grabs the full list of selected and writes it to the database?
EDIT: Nevermind, I got it! Thank you for helping me realize it should be possible with custom states. The solution was to have a parent container with type of “AlcoholType” (the Option Set with the list of alcohols) and workflow for each alcohol emoji to set custom state of parent row equal to its existing state then using “plus item” or “minus item” operators to add and subtract one at a time.
