Below is a screenshot of features I would like to create. I’m trying to figure out where to put this conditional formatting. On the screenshot below when the ‘Next Step’ button was clicked and inputs are empty the text warning messages are shown. Where do I put conditions for the warning text to show when ‘Next Step’ button is clicked?
There are multiple ways to do this.
Simple + Limitations – Bubble has logic that enables you to say a field is required and if the user clicks a button to run a workflow with that field, it won’t submit and will instead scroll to that field. This is really simple to implement, and has an okay UX. But, there’s no way to add messages in that scenario (as far as I understand). There’s also no way to have a workflow run that accepts a blank field that’s required for another.
Advanced – You can also create similar logic on your own using different elements in Bubble. It’s a lot more time consuming to set-up and maintain, but gives you full control. Lots of options in how you do this as well. Some tips: I like to set a small box (that I keep as transparent and 1px by 1px) to be hidden by default and to show up once all of the fields meet the required logic. This way, the logic is checked client side. Then, if the user clicks submit and that box isn’t show, then I’ll display an error message. I’ll set a custom state to “show-errors=yes” or something like that. Then, I’ll have each field set to conditionally show red or yellow background or border when it doesn’t meet the required conditions for that field and when show-errors = yes. There are other ways to do this if you want the fields to show red when users type in info that’s not valid right away. This is even better from a UX standpoint generally, but you need to take care not to show them while the user is typing in an answer, and not to display them before the user gets to that field.
As you can tell, there are lots of options for how you do this. While I clearly didn’t explain all of them, I hope I’ve given you enough of a feel for the different options that you can figure out which approach works best for you and then work through the details so that it meets your specific goals.
Best,
Scott
This topic was automatically closed after 70 days. New replies are no longer allowed.
