Single Page State Machine?

I’m looking to create a single page application that uses states to determine how the page should look at any given moment.

Previously, I’ve got this to work using states with boolean (yes/no) values, but since I now want to have more that two states, I want to figure out a way to check the values of the current state’s text, so that elements can turn themselves on and off accordingly.

What I’m having trouble with is checking/comparing the text value of the current state. In code it should look like:
If current page’s value == “State”:
Then hide
Else show

If anyone has any ideas on how to achieve this, I’m ears?

I use a text state, set in a custom element. You can create the custom element on the page, or on a group, or any other element. Set the default visibility of all groups to hide (uncheck the box for show element on page load) and then in conditional formatting, set visibility to true when the state = [text value for that group]

Thanks for the reply,

But what operator are you using to compare texts?

The “is/isnt” and “contains/doesnt contain” don’t seem to work.


See this page for an example:

Tap the edit button at the upper right to see the Bubble editor for that page.

Yeah, what @deadpoetnsp said. :+1:

Additionally, if you wanted to associate a unique URL with each page “state” (view), you might have a look at Sudsy. Check the docs and demos for more advanced examples of using initially-hidden groups and conditionals in response to URL changes.