Skip to Content (Press Enter)
2016-08-02 12-43-38
Setiaman Lee
966Views
14Comments
Multi Step form
Question
Hi,

I'd like to create multi step form as I have form with 70+ fields.
I'd like to get advice the best practice to do it in Outsystem.
Shall we create web block ? it wil be great if there is a video to wathc.

TIA.

Rgrds,
Setiaman
0
0
02 Jul 2016
Copy Link
2025-08-22 10-19-44
Pramod Jain
 
MVP
Hi lee, There is no direct control available for multistep form, what you can do is group your fields based on the steps and create different webblock for each step and show hide them based on what step you are. Regards -PJ-
0
0
03 Jul 2016
Copy Link
2016-08-02 12-43-38
Setiaman Lee
Pramod Jain wrote:
Hi lee, There is no direct control available for multistep form, what you can do is group your fields based on the steps and create different webblock for each step and show hide them based on what step you are. Regards -PJ-
 Thank you Pramod Jain.
I thought there is some magic way to do multi step form. I will need to try it out.
 
0
0
04 Jul 2016
Copy Link
2019-11-12 17-31-26
Justin James
 
MVP

I highly suggest you look at the Wizard block in SilkUI. They have what you need for a multi-step process and it works very nicely.


J.Ja

0
0
03 Jul 2016
Copy Link
2016-08-02 12-43-38
Setiaman Lee
Justin James wrote:

I highly suggest you look at the Wizard block in SilkUI. They have what you need for a multi-step process and it works very nicely.

 

J.Ja

 Hi Justin James,

I drag the Wizard block into the webpage but I have no idea how to proceed.
Is there any video to watch or sample solution?
Thank you.

Cheers,
Setiaman Lee
 
0
0
04 Jul 2016
Copy Link
2019-11-12 17-31-26
Justin James
 
MVP

Sateiaman -

I do not know if any video or samples, but it isn't hard to figure that out. You stick links to each step in the wizard (it can be 1 page using Ajax Submit, or separate pages if I remember right), and tell it what the current step is, and it takes care of the rest.

J.Ja

0
0
04 Jul 2016
Copy Link
2021-04-17 17-51-40
George Jeffcock
there is help with all these great patterns. I managed to use them by simply following the description text 

For example 'Wizard' Web Block Description:

"Used to split larger tasks into more manageable steps. Usually supported by explicit button navigation to move forward and backward.
 
Either use one of the Wizard patterns with pre-defined number of steps or use the generic Wizard and drag WizardStep's to its only placeholder. Inside each step, add a link to screen it should lead to. In smartphones, the wizard step labels are replaced with numbers."
1
0
04 Jul 2016
Copy Link
2019-11-11 17-10-24
Manish Jawla
 
MVP
Hi Setiaman,
Please check the below link for wizard:
https://labs.outsystems.net/londontheme/Wizard.aspx 
i have implemented the same in my project using css and hide/show the container.

Thanks,
Manish Jawla

0
0
04 Jul 2016
Copy Link
2021-04-17 17-51-40
George Jeffcock
Sateiaman please don't reinvent the wheel if you are thinking about it, you have paid for Outsystems so now use the Wizard block in SilkUI as Justin James pointed out. It will be supported and improved where as if you reinvent the wheel you might as well not be using low code.
1
0
04 Jul 2016
Copy Link
2025-08-22 10-19-44
Pramod Jain
 
MVP
Hi George, Agreed with you .if there is any existing component we should use that instead of reinventing it. Also we can put our suggestion any time to improve the component. Regards -PJ-
0
0
05 Jul 2016
Copy Link
2016-08-02 12-43-38
Setiaman Lee
Hi All,

Thank you for answering for question. I figured it out, it works by just dropping the web page into the placeholder of the wizard step. In my mind I thought all the fields will be in one screen but not in this case. Each screen we need to save it to the database. Correct me if I am wrong. it means there are data travel back to server and refreshing the browser for the next step.
It is not bad anyway for the quick implementation of multi step form.

Cheers,
Setiaman Lee
0
0
06 Jul 2016
Copy Link
UserImage.jpg
Shashankit Thakur

Hi,

I have a form which has 5 sections where each section has a web block. I tried using wizard widget to navigate across various sections of my form but for that  I had to create individual screens for each of my web blocks in the form. Isn't there any way by which I could traverse across various sections of a single web screen using wizard widget?

0
0
14 Oct 2018
Copy Link
2024-07-05 14-16-55
Daniël Kuhlmann
 
MVP

Shashankit Thakur wrote:

Hi,

I have a form which has 5 sections where each section has a web block. I tried using wizard widget to navigate across various sections of my form but for that  I had to create individual screens for each of my web blocks in the form. Isn't there any way by which I could traverse across various sections of a single web screen using wizard widget?

You can do this by using a webblock in each step. Hide/show the webblock via current step


0
0
14 Oct 2018
Copy Link
UserImage.jpg
Shashankit Thakur

Daniël Kuhlmann wrote:

Shashankit Thakur wrote:

Hi,

I have a form which has 5 sections where each section has a web block. I tried using wizard widget to navigate across various sections of my form but for that  I had to create individual screens for each of my web blocks in the form. Isn't there any way by which I could traverse across various sections of a single web screen using wizard widget?

You can do this by using a webblock in each step. Hide/show the webblock via current step


Hi Daniël,

I tried using web block for each step but it didn't work out as each step requires a link to a page. Moreover, "Active Step" property  also didn't progress accordingly from step1 to step5. Can you share an oml so that I could understand how it can be worked out?


0
0
14 Oct 2018
Copy Link
2019-09-24 18-41-25
Jorge Martins
 
MVP

Hi Shashankit,

The link that you need to provide to WizardStep can be for the current screen. Your screen likely needs to receive an extra input parameter to specify what step the user is on, and you'd use that information to make sure the Wizard is displaying the correct current step, and to decide which web block to display.

0
0
15 Oct 2018
Copy Link
Community GuidelinesBe kind and respectful, give credit to the original source of content, and search for duplicates before posting.