I have created a Stepper with a number of fields, I have a validation script block which checks if the fields contain content. What I would like to do is disable the Next button if all the fields have not been validated as valid i.e., containing content.
Here is an example that “prevents” you from moving on unless the validation conditions have been completed.
New-UDStepper -Id 'demoStepper' -Steps {
# Step 1
New-UDStep -Label 'Basic' -OnLoad {
New-UDTextbox -Id 'txtName' -Label 'Name'
}
# Step 2
New-UDStep -Label 'More' -OnLoad {
New-UDTextbox -Id 'txtAge' -Label 'Age' -Type number
}
# Review
New-UDStep -Label 'Review' -OnLoad {
New-UDMarkdown -Markdown ("**Name:** {0} `n**Age:** {1}" -f $EventData.Context.txtName, $EventData.Context.txtAge)
}
} -OnValidateStep {
$ctx = $EventData # has .CurrentStep and .Context
## CurrentStep can be used to target a specific step (starts from 0)
## ID (in this case txtName and txtAge) can be used for other logic.
## Context contains all the data you have submitted so fare.
## This modal will show you what information is in EventData throughout each step.
Show-UDModal -Content {
New-UDMarkdown -markdown ("**txtName:** {0} `n **txtAge:** {1} `n **context:** {2} `n **currentstep:** {3} `n **Condition:** {4}" -f $ctx.txtName,$ctx.txtAge, $ctx.context, $ctx.currentStep, $(([int]$EventData.txtAge -is [int])))
}
## You can use the currentStep and/or the ID of your textbox/other components for validation
## Here we look at the first step and make sure that the text box with the id txtName is not empty
If ($ctx.currentStep -eq 0) {
If ([string]::IsNullOrWhiteSpace($ctx.txtName)) {
New-UDValidationResult -ValidationError "Please fill out the text box"
}
}
## Here we target the second step and are checking if our textbox contains an int
## New-udtextbox can also be set to type number as I've done above. But for whatever reason it will still take text.. So this condition will prevent that.
if ($ctx.CurrentStep -eq 1) {
$raw = $ctx.txtAge
if ($null -eq $raw -or $raw -notmatch '^\d+$') {
New-UDValidationResult -ValidationError 'Will only accept a number'
}
}
## make sure to always return valid at the end
New-UDValidationResult -Valid
} -OnFinish {
Show-UDToast -Message 'Done!' -Duration 2500
}