OnClick events not registering properly when element added dynamically

PowerShell Universal Universal Dashboard
1 
Product: PowerShell Universal
Version: 4.3.0

Hi all,

I have text input and a button. OnClick adds a new Element (div) to an existing div. The added element contains a Remove button to remove itself. I belive the IDs are set properly. However, after I add a second item the OnClick event of the first (or any previous) one does not fire. Any clues? I don’t think it’s a scope problem, as the elements in the DOM have correct IDs. Just the onclick events don’t work.

New-UDStack -Children {
    New-UDTextbox -id 'txtInput' -Placeholder 'placeholder'
    New-UDButton -Text 'Submit' -id 'btnSubmit' -Size small -ShowLoading -onclick {
        $inputValue = (Get-UDElement -id 'txtInput').value
        if (!$inputValue) {continue}
        try {$user = Get-ADUser $inputValue -Properties DisplayName -ea Stop} catch {
            Show-UDToast -Message 'User not found' -Duration 5000
        }
        if ($user) {
            Add-UDElement -parentid 'container' -Content {
                New-UDElement -id ('item_'+$inputValue) -Content {
                    New-UDElement -tag div -Content {
                        New-UDIcon -icon 'user' -Size 1x -Style @{margin = '0 .8em 0 1em'}
                        New-UDButton -size small -id ('btn_'+$inputValue) -Text 'Remove' -onclick {
                            Show-UDToast -Message 'Removed'
                            Remove-UDElement -id ('item_'+$inputValue) -Broadcast -ParentId 'container'
                            Set-UDElement -id 'btnSubmit' -Properties @{Disabled = $false}
                        } -Style @{background = '#d92626'}
                        New-UDTypography -text ($inputValue+' - '+$user.DisplayName)
                    } -Attributes @{style = @{border = '.5px solid'; 'margin-left' = '4em'; padding = '.1em'}}
                } 
            }
            Set-UDElement -id 'txtInput' -Properties @{Value = ''}
        }
    }
    New-UDElement -Tag div -id 'container' -Content {} -Attributes @{style = @{width = '50%'; 'margin-left' = 'auto'}}
} -AlignItems center
2

Dear @adam, may I request some assistance here? Thank you! L.

3

Issue not resolved even after upgrading to 4.3.4… :confused:

4

At this point i’d say you should concider reacing out to support
Ironman Software Support,

Or create an issue of it on github:
Issues · ironmansoftware/powershell-universal (github.com)

1 Like
5

Issue created:
OnClick handlers not registering properly when element added dynamically · Issue #3585 · ironmansoftware/powershell-universal (github.com)