Dynamic Card Creation -- With User Input Data

Universal Dashboard Universal Dashboard Help
1

Is it possible to dynamically create cards from user input? For example… user inputs validation (from endpoints) creates a card with the user inputs field data. Ultimately looking to create multiple cards on a page containing user input data.

I am currently able to statically create cards and fill with user input data (modal with input fields), however, I am looking to have my users create their own cards filled with their input data.

Thanks,

2

Hi @dptkelly! Welcome to the forums!

You can use a UDInput to accept some input and then create some cards based on that input: https://docs.universaldashboard.io/components/inputs#replacing-the-contents-of-the-input-card

3

Thank you for the warm welcome, Adam.

I managed to accomplish dynamic creation of cards by coming up with the following:

Cards
Cards1018×565 42.2 KB 

[System.Collections.ArrayList] $blankArray = @()
[System.Collections.ArrayList] $MediaSelecion = @()

New-UDParagraph -Text "Please Select a Media Option" -Color gray

New-UDInput -Content{

    New-UDInputField -Name 'Selection' -Placeholder 'Select Media Option' -Type select -Values @("  ", "Value 1", "Value 2", "Value 3") -DefaultValue "Value 1"
    New-UDInputField -Name 'Action' -Placeholder 'Create Media Card' -Type textbox

}-Endpoint{
    param($Selection, $Action)

    $Cache:Add = [PSCustomObject] @{

        Selection = $Selection
        Action = $Action   
    }
}

New-UDButton "Button" -Text "Load Options" -BackgroundColor gray -OnClick{

    $Session:Clicked = $true

    $blankArray.Add($Cache:Add.Action)

    $MediaSelecion.Add($Cache:Add.Selection)

    Sync-UDElement -ID 'Value 1'
}

New-UDCard -Title "Support Disc Media Display" -Id 'Value 1' -Endpoint{

	if($Session:Clicked -and  $Cache:Add.Selection -eq "Value 1")
	{
		Foreach($nums in $blankArray)
		{
			Sync-UDElement -ID $($nums)
			
			#$pulldata =  $QueryFunction | Where-Object{$_.name -match "$($nums)" -and $.First -match "Another"}
			
		    New-UDCard -Id $($nums) -Title $($nums) -Watermark address_book_o -Content{
			    New-UDTable -Headers @("First", "Dummy", "Dummy", "Dummy", "Dummy", "Dummy", "Dummy", "Dummy", "Dummy", "Dummy", "Dummy", "Dummy") -Endpoint{
                     $pulldata | Out-UDTableData -Property @("First", "Dummy", "Dummy", "Dummy", "Dummy", "Dummy", "Dummy", "Dummy", "Dummy", "Dummy", "Dummy", "Dummy")
                        
                } 
			}
		}
	}
}
1 Like