Radio buttons allow the user to select one option from a set.
Use radio buttons when the user needs to see all available options. If available options can be collapsed, consider using a dropdown menu because it uses less space.
Radio buttons should have the most commonly used option selected by default.
Copy New-UDRadioGroup - Label "Day" - Content {
New-UDRadio - Label Monday - Value 'monday'
New-UDRadio - Label Tuesday - Value 'tuesday'
New-UDRadio - Label Wednesday - Value 'wednesday'
New-UDRadio - Label Thursday - Value 'thursday'
New-UDRadio - Label Friday - Value 'friday'
New-UDRadio - Label Saturday - Value 'saturday'
New-UDRadio - Label Sunday - Value 'sunday'
}
An event handler that is called when the radio group is changed. the $Body variable will contain the current value.
Copy New-UDRadioGroup - Label "Day" - Content {
New-UDRadio - Label Monday - Value 'monday'
New-UDRadio - Label Tuesday - Value 'tuesday'
New-UDRadio - Label Wednesday - Value 'wednesday'
New-UDRadio - Label Thursday - Value 'thursday'
New-UDRadio - Label Friday - Value 'friday'
New-UDRadio - Label Saturday - Value 'saturday'
New-UDRadio - Label Sunday - Value 'sunday'
} - OnChange { Show-UDToast - Message $Body }
}
Set the default value of the radio group.
Copy New-UDRadioGroup - Label "Day" - Content {
New-UDRadio - Label Monday - Value 'monday'
New-UDRadio - Label Tuesday - Value 'tuesday'
New-UDRadio - Label Wednesday - Value 'wednesday'
New-UDRadio - Label Thursday - Value 'thursday'
New-UDRadio - Label Friday - Value 'friday'
New-UDRadio - Label Saturday - Value 'saturday'
New-UDRadio - Label Sunday - Value 'sunday'
} - Value 'sunday'
You can use custom formatting within the radio group. The below example will place the radio buttons next to each other instead of on top of each other.
Copy New-UDRadioGroup - Label "Day" - Content {
New-UDRow - Columns {
New-UDColumn - LargeSize 1 - Content {
New-UDRadio - Label Monday - Value 'monday'
}
New-UDColumn - LargeSize 1 - Content {
New-UDRadio - Label Sunday - Value 'sunday'
}
}
}