How to display conditional forms

[jacastro]

I have two proforms on a page, and I need form 2 to be displayed only when I click the submit button on form 1.

Initially, I’m going to use the custom action on both forms, but I’m doing something wrong that’s not following my logic, as both forms are being displayed at the same time.

As per my scenario, it is not possible to use step-by-step forms.

I created an invisible field on form 1 and set the value to 1. Form 2 is below a conditional wrapper.

The image below illustrates the entire page structure.

Image 1

The image below illustrates the condition I created on form 2.

Image 2

The image below illustrates the invisible field on form 1.

Image 3

[manc]

I would probably use the On Submit Node, to add a class on success of the first form

You’ll likely need to also add or remove a class from the first form. Only potential issue I see is accidental reloads by the user for example. You could set a storage item or use a little JS to add some query parameters to the url. Then use those to show the correct form accordingly. Simple alternative would be to add a button like “already have a code?” and then do the same class toggling logic on click of that. Hope that helps