New-UDInput Behavior in 2.4.1 versus 2.2.1

I just upgraded from 2.2.1 to 2.4.1 and I noticed different display behavior when there are multiple UDInputs within the same New-UDInput. The old behavior was that each input was displayed on it’s own line (checkboxes in my case):

  • Input 1
  • Input 2
  • Input 3

After upgrading to 2.4.1, with no other changes to this page, all the inputs are now smashed onto 1 line:

  • Input 1-Input 2-Input 3

This happens if I use New-UDInputField as well as if I let the param() section define the checkboxes.

How can I get these back to being displayed on their own line. Code snippet here:

   New-UDInput -Title 'System Name' -Id 'InfoSystemToMonitor' -Content {

    New-UDInputField -Type 'textbox' -Name 'InfoSystem' -Placeholder 'Enter Server Name'
    New-UDInputField -Type 'checkbox' -Name 'General' -Placeholder 'General Info'
    New-UDInputField -Type 'checkbox' -Name 'Service' -Placeholder 'Service Status'
    New-UDInputField -Type 'checkbox' -Name 'Disk' -Placeholder 'Disk Info'
    New-UDInputField -Type 'checkbox' -Name 'Network' -Placeholder 'Network Info'
    New-UDInputField -Type 'checkbox' -Name 'CPU' -Placeholder 'CPU Info (Top 10 and Average)'
    New-UDInputField -Type 'checkbox' -Name 'Memory' -Placeholder 'Memory Info (Top 5 and 
Summary)'

} -Endpoint {

Hey @andon07 you need to use the new gridlayout to get best results:-
indent preformatted text by 4 spaces
New-UDTab -Text “New Vehicle” -Content {
$Layout = ‘{“lg”:[{“w”:8,“h”:14,“x”:2,“y”:0,“i”:“grid-element-inputid”,“moved”:false,“static”:false}]}’

        New-UDGridLayout -Layout $Layout -Content {
            New-UDInput -Id "inputid" -Title "New Vehicle Input" -Endpoint {
                param(
                    [Parameter(HelpMessage = "Vehicle Agreement")]
                    [ValidateSet("Spot Rent", "Contract Rent", "Owned")]$hire,
                    [Parameter(Mandatory)][UniversalDashboard.ValidationErrorMessage("The registration number you entered is invalid.")][ValidateLength(7, 7)][string]$RegistrationNumber,
                    [Parameter(Mandatory)][UniversalDashboard.ValidationErrorMessage("You must type in something.")][string]$Make,
                    [Parameter(Mandatory)][UniversalDashboard.ValidationErrorMessage("You must type in something.")][string]$Model,
                    [Parameter(HelpMessage = "Select Weight")][ValidateSet("0.5 tonne", "3.5 tonne", "5 tonne", "7.2 tonne", "7.5 tonne", "12 tonne", "15 tonne", "26 tonne")]$Weight,
                    [Parameter(Mandatory)][UniversalDashboard.ValidationErrorMessage("You must type in something.")][string]$BodyType,
                    [Parameter(Mandatory)][string]$Value,
                    [Parameter(HelpMessage = "Engine Type")][ValidateSet("Euro 1", "Euro 2", "Euro 3", "Euro 4", "Euro 5", "Euro 6", "Euro 7")]$EngineType,
                    [Parameter(Mandatory)][UniversalDashboard.ValidationErrorMessage("You must type in something.")][string]$HireCompany,
                    [Parameter(HelpMessage = "Select Depot")][ValidateSet("Brandon", "Bridge-End", "Bristol", "Cheshunt", "Kent", "Kirby & West", "Southampton")]$DepotName,
                    [Parameter(Mandatory)][UniversalDashboard.ValidationErrorMessage("The date format must be YYYY-MM-DD format.")][ValidatePattern('[0-9]{4}-[0-9]{2}-[0-9]{2}')][string]$StartDate,
                    [Parameter(Mandatory)][UniversalDashboard.ValidationErrorMessage("The date format must be YYYY-MM-DD format.")][ValidatePattern('[0-9]{4}-[0-9]{2}-[0-9]{2}')][string]$EndDate
                )

} -validate

if you dont use the gridlayout I found the placement to be random…anyways I hope this helps

I will try that. Thank you!

i just posted that dashboard I been working on in the show off section, I done a nice big gif recording…I got lots of inputs, and used the new-udpagedesigner (think thats the name) to design all my page layouts, that gives you the gridlayout…oh and by the way using the page designer defaults it to -LayoutJson which worked fine in 2.4.0 but in 2.4.1 you need to change -LayoutJson to just -Layout as shown in my code above

@psDevUK, how do you assign a default value when using this syntax below.

I wanted to assign today’s date as the default value to the EndDate input field. But I also want to integrate the validation.

$CurrentDate = Get-Date -Format “yyyy-MM-dd”

From your code above:

New-UDInput -Id “inputid” -Title “New Vehicle Input” -Endpoint {
param(
[Parameter(Mandatory)][UniversalDashboard.ValidationErrorMessage(“The date format must be YYYY-MM-DD format.”)][ValidatePattern(’[0-9]{4}-[0-9]{2}-[0-9]{2}’)][string]$StartDate,
[Parameter(Mandatory)][UniversalDashboard.ValidationErrorMessage(“The date format must be YYYY-MM-DD format.”)][ValidatePattern(’[0-9]{4}-[0-9]{2}-[0-9]{2}’)][string]$EndDate
)

Dude it’s been a while since this thread…I have even developed several custom components that would do this for you. Have a look on the marketplace. I got custom date picker day time picker UD field component to name a few which would all do this :ok_hand:
https://marketplace.universaldashboard.io/Dashboard/UniversalDashboard.UDDatePicker
https://marketplace.universaldashboard.io/Dashboard/UniversalDashboard.UDSelectDateTime
https://marketplace.universaldashboard.io/Dashboard/UniversalDashboard.UDNumberMask
https://marketplace.universaldashboard.io/Dashboard/UniversalDashboard.UDField