Multi-step Forms? PHP & Node 2022 UPDATES?

Wappler General
#1

Since I’m working on a new PHP/MySQL project that requires a Multi-step form I’ve tried to methodically filter out tutorials over a couple of years old where the UI of Wappler & features in that time period have changed too much from my 4.7.1 version.

Often I have to launch a Google search about Wappler to help me see the most relevant starting points to view the links to tutorials or docs.

The user logged-in Search function is Post confined & not often helpful for seeing the universe of Wappler tutorials or even docs.

But, in using the Forum search for “multi-step” or “multistep” I came across this thread which is recent and HUGE. After cruising down the page I realized that the ultimate Solution for creating this particular Multi-Step form should be a comprehensive Tutorial in a Video using 4.7.1.

The process, regardless of the specific parameters @Steven_Joiner needed regarding “10 form groups”, would be hugely useful (TO ME). :thinking:

Can developers point me to the most relevant & most useful Doc or Video tutorial relating to using 4.7.1 or a recent Wappler version for creating a multi-step form?

Many thanks!

#2

… in which case, you might have missed this tutorial by @Teodor. I think it’s probably as relevant now as it was when it was created.

1 Like
#3

Thank you, @TomD

This is the very first one I always find.
The very one specifically from June 2019 that I wanted to find out if it had been Updated since then.

#4

Well the date does not really matter.
Variable in 2022 is still a variable. The logic in 2022 i still the same - you show and hide regions based on a variable value …

#5

Yes, thank you, @Teodor

The concept of conditional show & hide I’ve used often.

I was wondering if in regard to Single Page Apps & using routing if there was an alternate method that has been used in the past year.

#6

For instance, would a PAGE APP Flow work here?

#7

Would a app flow work for what?

#8

For a multi-step form
Say, the Wappler way to use javascript as in this
example with react –

Or, since I’m using Bootstrap 5 how about using these Extensions as Blocks available in Wappler to get started with alternate Bootstrap 5 Designs specifically for MULTI-STEP Forms?

or using this example Wapplerized as a Block component available when using the Bootstrap 5 framework in the App page component.

Providing the files and a template for getting started with the process of a one page multi-step form.

#9

Sorry i am not following. The examples you point to use the same logic using a js variable for the active step.
Not sure how is this related to App Flows you mention?

#10