New-UDStepper and Step Validation

I am working on a Wizard style dashboard, and am curious about the step validation. I have created 4 steps thus far, and set validation on each. This works, however not until I am on page n+1 trying to go to n+2. For example, if I set a validation for page 1, I will not see the error until I am on page 2 and clicking the next button to go to page 3. If I then back up to page 1, whatever was entered on this page is wiped (as well as page 2 when I get back to it). I foresee users complaining because they got an error and could not remember what they typed in. I also noticed that NO validation happens on the last page, regardless of what I do.

So, I guess the question is two-fold: is there some way to perform the validation on the current page as soon as the user clicks next and not move on until that validation passes, and is there a way to persist the info entered into each page during a particular session?

Product: PowerShell Universal
Version: 1.5.3

Just wanted to bump this up, as I have not yet found an answer. I have been playing around with the New-UDStepper, but can only get validation to work on page n+1 still. If there is an error on Step 1, the user won’t see a notification for it until they click the Next button on page two to go to page three. Then when they go back to Page 1, any info entered will be deleted. Has anyone else seen similar behavior?

Edit: Now on 1.5.9, was on 1.5.3 back in December.

I’m opening an issue for this. Sounds like a bug.

Thanks, much

I think the problem you are having with the n+1 step validation is that the steps are 0 indexed. So if you want to validate the first step, you need to check that you are on step 0 and not step 1.

image

What I realized is on the docs, it was incorrectly using 1 instead of 0. I’ve updated the docs to reflect the 0 index.

https://docs.ironmansoftware.com/dashboard/components/navigation/stepper#validating-a-step

I can reproduce the issue with going back after moving forward and all the fields being reset. Still looking into that.

I figured out the issue with the values being blanked out. What you need to do is actually set the value of the component to the context of the stepper. I’ve updated the docs to reflect this.

Notice how I’ve added a -Value to each text field: New-UDTextbox -Id 'txtStep1' -Value $EventData.Context.txtStep1

New-UDStepper -Steps {
    New-UDStep -OnLoad {
        New-UDElement -tag 'div' -Content { "Step 1" }
        New-UDTextbox -Id 'txtStep1' -Value $EventData.Context.txtStep1
    } -Label "Step 1"
    New-UDStep -OnLoad {
        New-UDElement -tag 'div' -Content { "Step 2" }
        New-UDElement -tag 'div' -Content { "Previous data: $Body" }
        New-UDTextbox -Id 'txtStep2' -Value $EventData.Context.txtStep2
    } -Label "Step 2"
    New-UDStep -OnLoad {
        New-UDElement -tag 'div' -Content { "Step 3" }
        New-UDElement -tag 'div' -Content { "Previous data: $Body" }
        New-UDTextbox -Id 'txtStep3' -Value $EventData.Context.txtStep3
    } -Label "Step 3"
} -OnFinish {
    New-UDTypography -Text 'Nice! You did it!' -Variant h3
    New-UDElement -Tag 'div' -Id 'result' -Content {$Body}
}

Awesome, I will try this out today, thanks. I did confirm that changing from the 0-based count resolved the other half of the problem.