Select OnChange Update Card Contents

I am trying to update a card contents with the following code, but I do not think I have the write method of doing that, as it is not working. I did verify the OnChange is executing as I added a toast message to the below code.

Do I need to specify an Dynamic element?

New-UDCard -id 'card' -Title "Sample Card" -Content { 
      "Hello!"
}

New-UDSelect -id 'test' -label 'Select one' -Option {
    New-UDSelectOption -Name '1' -Value '1'
    New-UDSelectOption -Name '2' -Value '2'
} -Default 1 -OnChange { 
    Set-UDElement -id 'card' -content { 
        "You selected $EventData!
    }
}
PowerShell Universal 3.0.5

I’m a bit surprised that doesn’t work but you should be able to use a dynamic and sync.

New-UDCard -id 'card' -Title "Sample Card" -Content { 
New-UDDynamic -Id cardContent -Content {
      $Session:Content
}
}

New-UDSelect -id 'test' -label 'Select one' -Option {
    New-UDSelectOption -Name '1' -Value '1'
    New-UDSelectOption -Name '2' -Value '2'
} -Default 1 -OnChange { 
     $SessionContent =         "You selected $EventData!"
     Sync-UDElement -Id 'cardContent'
}
1 Like

Hey @adam

I tried this and cannot seem to get it to work.

          $session:prtMessage = "Location: $($userObj.loc) - Current Setting: $($userObj.curSetting) "
          New-UDCard -Title "Welcome $User" -id 'welcomeMsg2' -Content {        
            New-UDDynamic -Id cardContent -Content {
              $session:prtMessage
            }
          }
... more code here, but inside the same page
...
   -OnChange { 
              $newSetting = "Test"
              $session:prtMessage = "Location: $($userObj.loc) - New Setting: $($newSetting) "
              Sync-UDElement -Id 'welcomeMsg2'
}

You need to sync the dynamic.

     Sync-UDElement -Id 'cardContent'

Hey @adam

Ah, okay, that makes sense. I changed it and I can see it updating the text, except it started throwing errors. I am trying to access the $EventData variable to post back to the user what their last change was.

I might not be doing it right, but it is like it lost scope of it. I will keep playing with it.

This is what I am using, but it seems that using the Sync, does not allow me to access the $EventData once I changed the code to point to the correct Id.

The toast message shows up blank.

          New-UDCard -Title "Set Your Current Option At $($userObj.Location)" -id "setDefaultOpt" -Content { 
            New-UDForm -Content {
              New-UDSelect -Id "defaultOption" -Label "Option:" -Option {      
                New-UDSelectOption -Name 'None' -Value $false
                foreach ($options in $curOptions) { 
                  New-UDSelectOption -Name $($options.Name) -Value "$($options.Id)"
                }
              } -DefaultValue $($curDefaultOption.optionID)
            } -OnSubmit { 
                If ($curDefaultOption) { 
                  # Removed SQL Statement
                } else  {
                  # Removed SQL Statement
                }
                #Show-UDToast -Message "SQL STATEMENT"
                Show-UDToast -Message "$EventData"
                $optID = $EventData
                $newDefaultOption = ($curOptions | Where-Object { $_.Id -eq $($optID) }).Name | Out-String
                $session:prtMessage = "Store: $($userObj.Location) - New Default Option: $($newDefaultOption) "
                Sync-UDElement -Id 'cardContent'
                #Set-UDClipboard -Data SQL STATEMENT
                  Show-UDModal -Content {
                      New-UDTypography -Text "Success!"
                      New-UDElement -Tag 'p' -Content {
                        New-UDTypography -Text "Your default options has been set to: $newDefaultOption (Option ID: $optID)"
                      }
                  } -Footer {
                      New-UDButton -Text "Close" -OnClick { Hide-UDModal }
                  } -Persistent
            }
          }

Sorry. I’m spinning on what you’re attempting to do exactly and can’t see the trees from the forest.

What’s the overall behavior you’re looking for when the user selects the option?

Hey Adam,

That is my fault, I should have explained it better.
There is a top UDCard that says, 'You current selected “.
User select a choice from a dropdown and clicks ‘submit’, it should change the UDCard content to say, Your new selection is ”.

Before adding the Sync & Dynamic elements, I referenced the $EventData with a UDToast so I could prepare some SQL Calls. This worked perfectly. Adding the Sync & Dynamic element above (with the correct ID ‘cardContents’), updates the card, but the $EventData is null.

Here’s a simplified example that works for me.

    New-UDDynamic -Id 'card' -Content {
        New-UDCard -Text "You selected $Session:Selection"
    }

    New-UDForm -Content {
        New-UDselect -Id 'Selection' -Option {
            New-UDSelectOption -Name '1' -Value '1'
            New-UDSelectOption -Name '2' -Value '2'
            New-UDSelectOption -Name '3' -Value '3'
        }
    } -OnSubmit {
        $Session:Selection = $EventData.Selection
        Show-UDToast $Body
        Sync-UDElement -Id 'card'
    }

I noticed one thing in your snippet. $EventData is an object with properties for each field. So you’ll need to do this.

      $optID = $EventData.defaultOption

Also, make sure that your UDForm is not enclosed in the UDDynamic that is updating the card. We also fixed an issue in 3.1 (out tomorrow) with selects and default values so you could be running into that too if you aren’t switch the value before testing: New-UDSelect doesn't return default value · Issue #1307 · ironmansoftware/issues · GitHub

1 Like

Hey Adam,

Thank you for your detailed reply!
The sample definitely works in a blank dashboard, something in my current layout is causing EventData to be blank. I verified that my sample is setup like yours with the exception of the form being in a card of its own and using a layout. I will toy around with it tomorrow. :slight_smile:

1 Like

@adam

I finally got it working.
I was referencing $EventData but not the id of the element that I wanted to access and since there was only one element and I did not call it as $EventData.Selection; it came up null. Though, I would expect it to still return the main object ‘Selection’, or I could be wrong?