0

I am having a material dialog, in that dialog I've a stepper.. I've 4 steps.. where each step consists a form..

When I submit first step, I'm saving the form and moving to next step..

Here if I close my dialog and again if I try to open it again.. I want my stepper to start from step2. I don't want to go back to step 1 as it's submitted and step1 should be in completed state.

Here I've tried different scenearios most of the times I'm not getting form in the step2..

Can anyone please share any scenarios or solutions to achieve this..

sun
  • 1,832
  • 4
  • 19
  • 31
  • You'll have to restore the progress state, and write the form in a way that the step view is driven by that state. – jsejcksn Mar 02 '22 at 10:31
  • Can you share any example – sun Mar 02 '22 at 10:42
  • I've never written any Angular code, but I'm pretty sure it's described in the documentation [here](https://material.angular.io/components/stepper/overview#step-states). – jsejcksn Mar 02 '22 at 10:47
  • Yeah I've followed the documentation and tried scenarios as per the docs but faced some issues like I'm able to start from 2nd step but I'm not able to see my form in the 2nd step – sun Mar 02 '22 at 11:00
  • And also as you said by maintaining process state I'm not able to start from step2 it again starting from step1 – sun Mar 02 '22 at 11:03

1 Answers1

0

The solution is simple, you need to save the form data, when you close a form save the data inside an array. Next time you open the form you need to pass that array to the dialog component.

The first thing you need to perform is to patch the value of from. For example, if the length of the array is 1 then patch the index 0 objects value to form 1.

And to skip the step you can use the array's length. For example, length is one then your step will be 2. So you can simply set the step value.

Tayyab Arif
  • 1
  • 3