Set-UDElement without triggering onValidate?

PowerShell Universal
1 
Product: PowerShell Universal
Version: 4.4.0

I have a form, that contains

  • Subject - textField
  • Description - textArea
  • Email - textField
  • 5 dropdown selectionboxes.

When the onValidate is triggered, it checks if the fields contain the correct data - if not, the Icon property is set (to a red arrow) - thus marking the field that contains invalid data.

However - when triggering the Set-UDElement, another onValidate is triggered - thus starting an endless loop of onValidate events. Causing browser to spike in CPU usage.

2

I would suggest using a dummy element outside of the form’s inputs, and using the validation failure hook to replace the content with the icon.

If you are using the New-UDGrid cmdlets for layout on the form, it should be pretty easy to adjust the column structure to allow room for, say, a New-UDElement -Tag "div" -Id "subjectIcon", which can then be edited in the following ways:

  1. Adding the icon on validation failure:
Add-UDElement -ParentId "subjectIcon" -Content { New-UDIcon <# ... #> }
  1. Removing the icon on validation success:
# For your use case this is likely unnecessarily verbose.
# You can use other means, but the general structure here is
# hopefully helpful.
$elementChildren = (Get-UDElement -Id "subjectIcon").Content
foreach ($child in $ElementChildren ) {
  Remove-UDElement -Id $child.Id
}

Please let me know if this works; since you aren’t editing properties of input types, this shouldn’t trigger onValidate, but I may be wrong. This is all theoretical at this point.
:wavy_dash:ZG

1 Like
3

Could you please share the code for this? I am stuck with handling form validation properly.

4

Hi KST, sorry for the late response.

My form is now around 1100 lines of code, that does the job - the snippet below is just the single UD Textbox alone.

I am using $id because the form consists of multiple entries that I can browse through. ( $session:fsTabs )

$session:fsTicketsRequestersDep is a list of objects returned from our ticketingsystem, valid known recipients. So if an email matches up to one of those, I automatically add the FirstName/LastName to the label of the textbox.

Function IsValidEmail verifies the correct formed validity of entered email address.

Function ValidateTabs verifies all $session:fstabs for validity enabling/disabling my submitbutton.

I decidede to use -OnBlur instead of -OnChange for the firstname/lastname lookup as it only triggered when you left the textfield - the cpu usage went up a bit as the $session:fsTicketsRequestersDep contained over 1000 entries

        New-UDTextbox -Id "txtEmail$id" -Fullwidth -Label $labelEmail -Value $session:fstabs[$id].email -OnBlur  {

            if ( -not (IsValidEmail -EmailAddress $EventData) ) {
                Set-UDElement -Id "txtEmail$id" -Properties @{
                     Icon = (New-UDIcon -Icon ArrowRight -Style @{ color = 'red'})
                     label = "Recipient (invalid email)"
                }
            }
            else {

                $thisRecipient = $session:fsTicketsRequestersDep.where( { $_.primary_email -eq $EventData })

                $session:fstabs[$id].email = [String]$EventData

                if ( $thisRecipient ) {
                    # Show-UDToast -Message "txtEmail$id -> $($thisRecipient | Out-String)" -Duration 5000
                    $session:fstabs[$id].fname = $thisRecipient.first_name
                    $session:fstabs[$id].lname = $thisRecipient.last_name
                    Set-UDElement -Id "txtEmail$id" -Properties @{
                        Icon = $null
                        label = "Recipient (" + $( if ( $thisRecipient.is_agent ) { "AGENT " } ) + $thisRecipient.first_name + " " + $thisRecipient.last_name + ") "
                    }

                }
                else {
                    $session:fstabs[$id].fname = ""
                    $session:fstabs[$id].lname = ""
                    Set-UDElement -Id "txtEmail$id" -Properties @{
                        Icon = $null
                        label = "Recipient"
                        Spellcheck = $false
                    }
                }
            }

        } -OnChange {
            if ( -not (IsValidEmail -EmailAddress $EventData) ) {
                Set-UDElement -Id "txtEmail$id" -Properties @{
                     Icon = (New-UDIcon -Icon ArrowRight -Style @{ color = 'red'})
                     label = "Recipient - invalid email"
                }
            }

            ValidateTabs

        }

The result when an invalid email is entered:
image

The result when a valid email is entered:
image

The result when a known valid email is entered:
image