Unable to Sync UDTable

Universal Dashboard Universal Dashboard Help
1

Hello everyone, I’m back again. I’m just getting started with Universal Dashboard and have been hitting quite a few roadblocks mainly related to my own stupidity. Currently, I’m attempting to use the Sync-UDElement cmdlet to resync a table, allowing me to update it’s contents. This seems fairly straight forward, but regardless of what I do, nothing seems to update the table. Are tables incapable of being synced?

In the below code snippet, when the “EDIT” button is clicked, the Domain ID should become “BOOP!” (demonstration purposes only, I swear), and the Renewal Status should become a dropdown box, but nothing happens. I also included a toast message just to ensure the EditDomain variable was being set correctly, which it is.

I also noticed these three errors in Chrome’s dev console:
image

Code Snippet:

$DomainInfo = [PSCustomObject]@{
    domainId=123456
    status='pending'
    dateExpires='06/30/2019'
    renewalStatus='auto'
    UDFs=@{
        Division='Division 1'
    }

}
$ButtonColor = '#26a69a'
$Cache:EditDomain = $false

$Dashboard = New-UDDashboard -Title "Stock Chart" -Content {
    New-UDRow -Id 'row-btns' -Endpoint {
        New-UDColumn -MediumSize 6 -LargeSize 6 -Content {
            New-UDButton -Text 'Edit' -Id 'domain-edit-btn' -Icon pencil -OnClick {
                $Cache:EditDomain = !($Cache:EditDomain)
                Show-UDToast -Message $Cache:EditDomain -Duration 6000 -Title “Info” -Position topRight -BackgroundColor $ButtonColor
                Sync-UDElement -Id 'domain-details-tbl'
            }
        }

        New-UDColumn -MediumSize 6 -LargeSize 6 -Content {
            New-UDButton -Text 'Edit' -Id 'udf-edit-btn' -Icon pencil -OnClick {
                Show-UDToast -Message $Cache:EditDomain -Duration 6000 -Title “Info” -Position topRight -BackgroundColor $ButtonColor
            }
        }
    }

    New-UDRow -Endpoint {
        New-UDColumn -MediumSize 6 -LargeSize 6 -Content {              
            New-UDTable -Id 'domain-details-tbl' -Title 'Settings' -Headers @(" "," ") -Endpoint {
                Show-UDToast -Message $Cache:EditDomain -Duration 6000 -Title “Info” -Position topRight -BackgroundColor $ButtonColor

                $Select = New-UDSelect -Option {
                    New-UDSelectOption -Name 'Do Not Renew' -Value 'do not renew'
                    New-UDSelectOption -Name 'Auto' -Value 'auto'
                    New-UDSelectOption -Name 'Manual' -Value 'manual'
                }

                @{
                    'Domain ID'=if($Cache:EditDomain){'BOOP!'}else{$DomainInfo.domainId}
                    'Status'=$DomainInfo.status
                    'Date of Expiration'=if($DomainInfo.dateExpires){Get-Date $DomainInfo.dateExpires.Split('T')[0] -UFormat '%D'}else{'N/A'}
                    'Renewal Status'=if($Cache:EditDomain){$Select}else{$DomainInfo.renewalStatus}
                }.GetEnumerator() | Out-UDTableData -Property "Name","Value"
            }
        }
        New-UDColumn -MediumSize 6 -LargeSize 6 -Content {
            New-UDTable -Title 'User Defined Fields' -Headers @(" "," ") -Endpoint {
                $DomainInfo.UDFs.GetEnumerator() | Out-UDTableData -Property "Name","Value"
            } -Id 'udf-details-tbl'
        }
    }
}

Start-UDDashboard -Dashboard $Dashboard -Port 10000
2

hey @jmknight2 my Friday nights dont get much better than dashboarding so looking into this now…hopefully I can get you something soon…sorry @jmknight2 the mrs was hungry so just eaten a lovely chinese take-away…After some noodle goodness I came up with this:-


Shows how you can sync a ud table. Hope this helps fella :smile:
I tried to replicate your dashboard (apart from the data) as in using cached varibles…and you had a button, so thought of this generic example to hopefully get what you want working.

1 Like
3

Thanks for the response! Chinese take-out certainly sounds great right about now!

Just a quick question though. Perhaps I’m mistaken, but doesn’t your sample script suffer from the same issue, where you can’t directly sync the table via Sync-UDElement? From what I can tell, the table only updates every 5 seconds as per the refresh interval, and not as a result of the call to Sync-UDElement.

The issue with this method is that it causes the effected elements to be physically redrawn in the DOM every cycle. In my tests this has caused the elements to flicker among other issues. My current workaround is to change the necessary variables, then refresh the page, thus causing the table’s endpoint to be recalled and syncing it’s data based on the new data.

It’s a somewhat clunky solution I know, but for the moment, it’s workable.

Thanks again for your input!

4

Hi @jmknight2 happy to hear you have a workaround, it was pretty late when I done that script, changing the refresh interval to 1 second does make it instant change. I personally never tried to sync a table before, I prefer to use grids on my dashboard, as end user can filter those. I have the sync working sweetly on my dashboard project I uploaded in the show off section, which I have also put on github…have you read https://poshtools.com/2018/11/13/dynamically-updating-controls-with-sync-udelement/ as thats what helped me

5

Hi @psDevUK one thing i have noticed in 2.4.1 as well is when you use the sync-udelement the out-udgridata data will be refreshed but it will remove your filter.

so for example i have a dshboard setup to output services and their status so when you filter by service name in previews ud releases and click a button to start or stop a service and click another button to sync the status will be updated and your filter for the service name retain.

with 2.4.1 release doing the same will refresh the whole out-udgridata and you have to filter by service name again to see the status.

her is a sample of my code

...
    $Page1 = New-UDPage -Name "Services" -Icon server -Content {


         New-UDElement -Id "Services" -Tag div4 -EndPoint {

        New-UDGrid -Id "Grid" -Title "Services" -Headers @("Name","Status","Select") -Properties @("Name","Status","Select") -Endpoint {
        
                $Cache:Services | Out-UDGridData
               
                  }
                                 
              }  
                        
             New-UDButton -Text "Refresh" -OnClick {
             Sync-UDElement -Id "Grid" -Broadcast       
          } 
      } 
    ...