Making one page multipurpose with customization based on source

Need help
1

Hello,

I’ve building a new app. I have a page where I have 4 buttons: Family, friends, work and community. When I hit the button, it then goes to another page where I can put their contact information. I’d like the header to be different on that second page depending on what button I hit. So if I hit Family, the header on the contact input page would be Family. I though I’d set a custom state when I clicked the first Family button. Then on the second page, us a condition to select which header to show. But when I get there, i don’t see the option to find the custom state as an option. Is there a better way to do this? Do custom states not move from one page to another?

2
  1. Create option set , family,friends,work, comunity
  2. go to page example.com/page/family
  3. get data from path url, item#2 is family

or you can do that with parameter but it will look ugly

or you can go to page and send item, and set the pages item as that value but you can only do that for 1 data type

3

Hi Emir, @emir.ozgun

I’m not sure I understand.
I created an option set of those 4 items. Then in my workflow on the Onboarding page (which is the first page), there are 4 options: Family, Friends, Work, Community. When I click on the Family button, I have a workflow which has the option to set a custom state:

image
image1176×546 36.7 KB

Then on my Add Contact page, I want to change the header based on what someone picks (Family button on Onboarding page will result in Family header on Add Contact page, etc.) So I want to set a condition on the header that when the custom state for “category” on the custom element of the group in the Onboarding page is clicked, then it will set the header on the Add Contact page to the Family group (I’ll then have another one for Friends, etc.) But in here you don’t see any elements from another page.

image
image1421×777 70.4 KB

How do I get the element from another page to be added to an element on this page so I can use it? I even set a property on my Onboarding page hoping it would push to my Add Contact page but it didn’t. Or I don’t know how to find it.

image
image656×926 32.6 KB

I appreciate your help.

4

Don’t use the state, use the properties of the view. You can find everything in detail in the Bubble documentation or you can ask bubble bot for more details (go to bubble.io, it appears at the bottom right). I hope it helps.

5

You can’t use custom states for a different page so your options are, as I pointed out, from url path, from url parameter or from property. I suggest you to pass as a path.

and maybe some js2bubble tweaks but it is for advanced users

6

Custom state can be accessed by the element where you have defined it, and it’s child elements. So, you can’t access custom state on your ‘Onboarding’ page from ‘Add contact’ page.

Essentially, you are passing some info from one page to another. What I suggest in terms of increasing complexity:

  1. Send the info based on button pressed as URL parameter. On the new page, assuming you have separate header groups, show the one relevant based on the URL parameter. Simple search on Youtube will give you several videos to see and follow.
  2. Make this the thing of the new page (if you can work so with it) and send it page data.
  3. Browser’s session storage. It can persist across pages, but you’ll need plugins or work with code. you can refer this video for Floppy plugin, but there are a few other options too.