I am trying to create a “simple” 3 step form on the same page. Somebody previously suggested:
The way I’d do it is on the same page, with 3 groups that you hide and show based on the step.
Sounds great in theory. How? Why can’t I put 3 groups on top of each other (each with a few input fields), have a button at the bottom that when pressed hides group 1 & shows group 2?
Somebody else also said:
So you would create a custom state on your page of “Current View”. And then use Conditional statements to show / hide your elements. Workflows then set the state of the View.
Huh?
Maybe its just me, but the documentation doesn’t seem to explain this very well. What is the purpose of a “state”?
Can somebody please explain how to create a 3 step form by showing/hiding groups as if I’m six.
What is the problem here? You can definitely have elements on the top of each other, and hide them/show them with the hidable box on the left. You just need to make these elements not visible by default (check the box at the bottom of the property editor).
To show/hide elements when the user clicks on a button, you can either show/them manually with these relevant actions (Element section), or, better, define a custom state and show/hide elements based on the value of the state in the conditional tab for each element.
I have used a number (current page) as a custom state on the main page. It is just like a temporary store for something. I could have used text, but as you can see, having a number makes things easier.
Create a page, and add 3 Groups. Make them all hidden.
On page load I have set the state currentpage = 1 (so we always start at the beginning).
Create two buttons for forward and back. They add 1 and subrtract 1 from current page respectively.
Each group then has a condition that says "when current page = 1 (or 2 or 3) then become visible.
I then added a condition to the buttons so that if the current page is 1, then previous is unclickable.
And if the current page is 3, then Next is unclickable.
The nice thing about doing it this way is you can add many new groups, and all you need to do is set the condition on the group, and make sure the condition on the next stops at the highest number.
I’m making a multi-step input form and I just wanted to check this was still the best way to do it (since the conversation is a few years old now).
I was already starting with having multiple groups on one page and hiding/showing them but wondered if that meant I need multiple next/previous buttons that themselves hide/show as I go along.
I saw that, but doesn’t that require me to use it for the whole app? Can I use a Template within an existing app that I have already built? I thought that would be a plug-in.
I’m trying where possible so far to do things with Bubble’s existing tools so I can learn the system better.
