Checkbox
Check component for Universal Dashboard
Checkboxes allow the user to select one or more items from a set.

Checkboxes

Checkboxes can be disabled and checked by default
1
New-UDCheckBox
2
New-UDCheckBox -Disabled
3
New-UDCheckBox -Checked $true
4
New-UDCheckBox -Checked $true -Disabled
Copied!

Checkboxes with custom icon

Create checkboxes that use any icon and style.
1
$Icon = New-UDIcon -Icon angry -Size lg -Regular
2
$CheckedIcon = New-UDIcon -Icon angry -Size lg
3
New-UDCheckBox -Icon $Icon -CheckedIcon $CheckedIcon -Style @{color = '#2196f3'}
Copied!

Checkboxes with onChange script block

Create checkboxes that fire script blocks when changed.
1
New-UDCheckBox -OnChange {
2
Show-UDToast -Title 'Checkbox' -Message $Body
3
}
Copied!

Checkbox with custom label placement

You can adjust where the label for the checkbox is placed.
1
New-UDCheckBox -Label 'Demo' -LabelPlacement start
2
New-UDCheckBox -Label 'Demo' -LabelPlacement top
3
New-UDCheckBox -Label 'Demo' -LabelPlacement bottom
4
New-UDCheckBox -Label 'Demo' -LabelPlacement end
Copied!

Get the value of a Checkbox

You can use Get-UDElement to get the value of the checkbox. Get-UDElement will also return other properties of the checkbox component.
The following example shows a toast message with the value of the checkbox.
1
New-UDCheckbox -Id 'MyCheckbox'
2
3
New-UDButton -Text 'Get Value' -OnClick {
4
Show-UDToast -Message (Get-UDElement -Id 'MyCheckbox').checked
5
}
Copied!
New-UDCheckbox
Name
Type
Description
Required
Label
String
The label to show next to the checkbox.
false
Icon
Object
The icon to show instead of the default icon.
false
CheckedIcon
Object
The icon to show instead of the default checked icon.
false
OnChange
Endpoint
Called when the value of the checkbox changes. The $EventData variable will have the current value of the checkbox.
false
Style
Hashtable
A hashtable of styles to apply to the checkbox.
false
Disabled
SwitchParameter
Whether the checkbox is disabled.
false
Checked
Boolean
Whether the checkbox is checked.
false
ClassName
String
A CSS class to assign to the checkbox.
false
LabelPlacement
String
Where to place the label.
false
Id
String
The ID of the component. It defaults to a random GUID.
false
Last modified 6mo ago