Is there a way to bring or reference a CUSTOM STATE in another page?

[ericwillcampbell3]

Is there a way to bring or reference a CUSTOM STATE in another page to a new page? I have to buttons on a home page, clicking them will take you to a settings page. The challenge is each button is supposed to present you different functionalities hidden and set to Show when a condition is true on the settings page. The two buttons from the home page are the triggers for those CUSTOM STATES.
How do I reference them in the CONDITIONAL STATEMENTS in the settings page because I’m not presented with the PROFILE PAGE as an element from which I can choose those CUSTOM STATES and either set their values to YES or NO?

[reger-alexander]

Yes, you can hand them over as URL parameters

[adamhholmes]

Unless you’re saving something in the database (or on the User’s computer), you’ll need to use URL parameters in this case…

So add any relevant parameters when navigating to the page, then use conditionals on the destination page and Get Data From URL to access the parameter values.

[ericwillcampbell3]

Thanks… but I’m new here and I dont know how to do that

[JohnMark]

You can also use the Browser Storage plugin (or something similar) and write directly to the browser memory (creating your variables) and then call it in your next page. I’ve done this for years without using URLs anymore. There is also encryption that you can enable and it keep your URL clean.

[heythere]

Hi @ericwillcampbell3 - You’re right, you can’t pass custom states from one page to another in the way you might expect. I would do it @reger-alexander’s way, using URL parameters. Looks like this:

In your “Go to page” action from the Settings page, check the “Send more parameters to the page” box. In the ‘key’ box, type whatever makes sense for the data you’re sending.

• In this example, I have a custom state on that original page called “mode” and I want to send that. So I’ve named the key the same as the custom state I’m trying to send.
• Also in this example, I’ve got a conditional on the workflow telling when that specific value for the key gets sent. If the ‘mode’ custom state from the page = create, it sends they value ‘create’ for that key. You would also want a second ‘go to page’ workflow with the other possible value - say ‘update’.
• Alternatively, you can send dynamic data. For example, set the ‘mode’ key’s value to [page]'s [custom state]'s [value]. This way you have just one action with no conditionals - it will just pass along whatever is in the custom state. Note that this will only work if the value of the custom state is a text string. If not (ex: the custom state’s field type is a data type or an option set), you’ll need so send a text value that can be read - let’s say you’re sending a user, you’d send the User’s ID. If you’re sending an option from an option set, you’d send the ‘display’ or an attribute that’s a text type. I often add a “url parameter” attribute on my option sets so i have something to point to when sending data in this way.
• Also FYI, you can send more than one parameter

Now, when that action fires, your user will be sent to the page you’ve marked as the “Destination”, along with those parameters in the URL.

This doesn’t really have any effect until you set up the page to receive it in some way.

Set up the page to do something with that data

This could be a number of things - maybe you want to set a custom state on the destination page, or set a visibility conditional on an element, or conditionals on workflows… It essentially works just like a custom state. You do this using the ‘Get data from page URL’ command. Here’s what it looks like:

In the example below, when the page loads, I want to set a state with the same value I sent from the previous page. So I add a ‘set state’ action, select the state I’m setting, and then in the ‘value’ field, I select the option ‘Get data from page URL’.

This is telling Bubble to look in the url for that specific key and read the value. So you need to tell bubble specifically what parameter to look for in the URL. This is the same thing you set in your ‘go to page’ workflow action in the previous page.

Since we’ve just sent a text parameter, the ‘type’ dropdown can stay ‘text’, but if you sent a user or some other piece of data from your database (or from an option set), you could select that in the ‘type’ dropdown.

The important thing is that the ‘key’ name you typed in on that ‘go to page’ action on the previous page matches the ‘Parameter name’ in this box EXACTLY. Otherwise, it won’t read.

---

URL parameters are super handy, and I’ve found them to be more reliable than custom states in a number of ways. My understanding is that it’s also how traditional dev works. (Do a search in AirBNB or an airline’s website or really any other web app, and then look at the url - the url will be FULL of parameters.)

Anyways, hope this helps! Holler if anything’s unclear.

[ericwillcampbell3]

Thanks… It worked