Radio Button

Overview

The Radio Button Web Control is a visible indicator of the selection state. It can be used in a Radio List and will have a value bound to the selected state of the Radio Cell, or it can exist on its own and have a value defined by its data binding. Even though it is possible, it is not advisable to use them outside a Radio List.

organizing info

Control Properties

Within a Radio List

There are no properties when rendered within a radio list. The list and Radio Cell give the radio button the data associated with its selection.

Outside of a Radio List

There is only a Data Binding Property to Selected outside of a list. This property is a boolean to determine whether the radio button should be selected.

Control Actions

Within a Radio List

The Radio Cell performs the actions for the radio button in this case. There are no actions on the Radio Button.

Outside of a Radio List

Value Changed- gets fired when the selection state of the radio button is changed. Please check out Action Builder to find all the available actions.

Styling and Theming

A Radio Button behaves like a Button. This means that the radio button has styles for the following states:

  • Default - When first rendered without the state.
  • Hover - When the user is hovering over the radio button.
  • Focused - when the radio button or radio cell is focused.
  • Pressed - when the radio button is being pressed.
  • Selected - when the data binding evaluates to true.
  • Disabled - When the cell is disabled.

Example 1: Radio Button in List of items to make a selection

Radio Buttons can be used in a Radio List to display the selection state on a list of items:

organizing info

To enable this, place a radio button within a Radio Cell Web Control within a Radio Button List. The Cell and List will maintain the state of the radio button.