Reactive web persist data for Wizard form.

Is it possible to persist data between the wizards steps?

I've done up a wizard and everything is working but when I click on "back/prev" in step2 (in the wizard steps) the data is step 1 will be gone.

So i'm wondering how do I persist the data? Must I share the same structure or?

Hello MingQuan,

Yes, it is possible to persist data between the wizards steps. There are multiple ways to do this:

  • If you have the steps in the same page / block, you can share the structure with the data between the steps. When you go back to the previous step, the data that you filled in the previous steps is still there;
  • If you have the steps in different pages / blocks, you need to pass the data between them (pass the structure between steps via input parameters or using events);
  • An alternative way is to persist the data in the database everytime you move forward or backward, but you need to fetch it everytime you enter a step.


Kind regards,

Rui Barradas

Hi,

In attachment and example of a wizard implementation in reactive.

Regards,

Marcelo

Marcelo Ferreira wrote:

Hi,

In attachment and example of a wizard implementation in reactive.

Regards,

Marcelo

 Hi Marcelo,


I tried the above example and I can find that the form in a reactive web in case of using a wizard not validating at all and submits without validation.


even I tried to do a server validation inside client action and set the control is valid property = false and didn't work the form also submits.

Regards,

Hi Amr,

Setting the Valid property of a control to false only signals the User that something is wrong.
In order to prevent the action to execute its purpose if something is wrong, add an IF after all your custom validations, and before the action feature code.

Use something like YourFormName.Valid as the condition.

Connect the true branch to the feature code, and the false to an end node. 

This way, if the validation fails, the feature code will not be executed.

This is explained in the Reactive Online Training. So, if you didn't finish it yet, I recommend doing so. 

Cheers!

Dear Eduardo,


Thanks for your fast reply, actually I did exactly what you mentioned. but I can find that the form submits despite the fact that it goes to my custom validation true branch.

I have noticed that if the last step of my wizard has a validation here it will stop but in my case that the last step all controls and not required.



And I did a small modification on the above example I made the "Save" button to be available in the first step and when I Press it shows the error and stops the form from submitting. so it smees that the validation only works if the button and validation are in the same wizard item.

Any help with that?


Hi,

The problem is that the widget is not in the HTML when you get to the last step, so the Form will not take it into consideration when checking the validation. 

An possible solution is to validate the data when trying to leave to the next step, and not allowing it if something is wrong.

Cheers.

P.S. Another possibility is to "hide" the parts of the form, instead of "removing" them from the form. This means that you could use a container around the sections and control visibility through the Visible property, instead of using IFs. This way, all the controls would be in the form.

This solution has a caveat. If you have mandatory fields that should be there only on certain conditions, you will have to control them with IF anyway, so they appear only on the right conditions, because if they are just hide when they are not needed, the validation would fail as they would not be defined by the user.

Amr Ramadan wrote:

Dear Eduardo,


Thanks for your fast reply, actually I did exactly what you mentioned. but I can find that the form submits despite the fact that it goes to my custom validation true branch.

I have noticed that if the last step of my wizard has a validation here it will stop but in my case that the last step all controls and not required.



And I did a small modification on the above example I made the "Save" button to be available in the first step and when I Press it shows the error and stops the form from submitting. so it smees that the validation only works if the button and validation are in the same wizard item.

Any help with that?



I've also had a similar issue like you are having. I tried switching from "if"s to containers and changing the visibility just like Eduardo suggested above, but still wouldn't validate every piece of mandatory/validation I had on the previous wizard steps.

So what worked for me was having inline style css on the container that would switch the display property:

style:

If(CurrentStep = 3 , "","display: none")


Hope this helps!

Luís Xavier wrote:

Amr Ramadan wrote:

Dear Eduardo,


Thanks for your fast reply, actually I did exactly what you mentioned. but I can find that the form submits despite the fact that it goes to my custom validation true branch.

I have noticed that if the last step of my wizard has a validation here it will stop but in my case that the last step all controls and not required.



And I did a small modification on the above example I made the "Save" button to be available in the first step and when I Press it shows the error and stops the form from submitting. so it smees that the validation only works if the button and validation are in the same wizard item.

Any help with that?



I've also had a similar issue like you are having. I tried switching from "if"s to containers and changing the visibility just like Eduardo suggested above, but still wouldn't validate every piece of mandatory/validation I had on the previous wizard steps.

So what worked for me was having inline style css on the container that would switch the display property:

style:

If(CurrentStep = 3 , "","display: none")


Hope this helps!

 

Thank you, Eduardo and Luís for your help.
Actually Luís reply saved me and works fine for me.

Actually, I need to make a correction. 

The Visible property acts like the If widget. 

The Display property, from containers, keep the container and its content in the HTML. 

But I need to check if the behavior, for the form validation keeps the same as in Traditional Web, that is what I would expect, but I am not sure at this moment. 

Glad that Luiz answer helped solving your issue :) 

Well done, Luiz :)