Xojo Documentation Xojo Documentation

For desktop applications, see RadioButton.

Class (inherits from WebControl)

Allows you to add a set of radio buttons to a web page. You can group the buttons in any number of columns and rows.

Events

Close KeyPressed MouseUp ContextualMenuAction LostFocus Open DoubleClick MouseDown Resized DropObject MouseEnter SelectionChanged GotFocus MouseExit Shown Hidden MouseMove

Properties

ColumnCount Left Parent ContextualMenu LockBottom RowCount ControlID LockHorizontal Style Cursor LockLeft Top DragOverStyle LockRight VerticalCenter Enabled LockTop Visible Height LockVertical Width HelpTag Name Zindex HorizontalCenter Page

Methods

AcceptPictureDrop CellSelected SelectByCaption AcceptRawDataDrop CellTag SelectByTag AcceptTextDrop CellValue SelectedCaption AllowPictureDrag CellVisible SelectedCell AllowRawDataDrag Close SelectedTag AllowTextDrag ExecuteJavaScript SetFocus CellCaption MsgBox ShowURL CellEnabled PresentContextualMenu

Notes

RadioGroup manages a set of radio buttons, which can be organized by rows and columns. In the IDE, you can edit properties of individual cells by clicking on the "pencil" icon to put the RadioGroup into edit mode. When in edit mode, clicking on individual radio button cells displays their properties in the IDE.

By default, the WebRadioGroup control creates a group with two rows and one column, but this is easily changed via the ColumnCount and RowCount properties in the Behavior group.

To determine which radiobutton was clicked, place code in the SelectionChanged event. This event is analogous to the Action event of a RadioButton. See the example for the SelectionChanged event or the examples in the SelectedCaption, SelectedCell, and SelectedTag properties.

The SelectedCell method gives you the Row : Column value of the selected cell as a Pair. Row and Column are zero-based. To determine which RadioButton in the control was clicked, test the RadioButtons in the SelectionChanged event handler. See the example in the SelectedCell method.

You can access the individual cells using CellCaption, CellEnabled, CellTag, CellValue, and CellVisible. You can also get the currently selected Caption or Tag in the SelectionChanged event using SelectedCaption or SelectedTag, respectively.

The CellTag is a unique string you can give to each cell to allow you to quickly identify cells, without relying on the caption. It serves the same purpose as a RowTag for a WebListBox and other controls.

When you add a RadioGroup, you can click the "pencil" icon to go into edit mode where you can select the individual radio button cells. When you select a radio button cell, its properties appear in the IDE.

In code, you pass the row and column indexes to these properties to indicate which radio button you are referring to.

Sample Code

See the individual events, properties, and methods for more examples.

The following uses CellCaption to caption a new radio button.

Me.CellCaption(0, 2) = "Cell 0,2"

This code disables the cell.

Me.CellEnabled(0, 2) = False

This code selects a radio button, which has the effect of unchecking all the other radio buttons in the group:

Me.CellValue(0, 1) = True

This code hides the specified radiobutton.

Me.CellVisible(0, 2) = False

Use SelectedCell in the SelectionChanged event handler to determine which radio button was clicked. Since SelectedCell is a Pair, the Left property represents the row index and the right property is the column index. The indexes are zero-based.

The default WebRadioGroup has two rows and one column. To determine which radio button was clicked, simply test the Row index. For example:

Var p As Pair

p = Me.SelectedCell
Select Case p.Left
Case 0 // Row 1
MessageBox("You clicked the top button.")
Case 1 // Row 2
MessageBox("You clicked the bottom button.")
End Select

See Also

WebCheckBox, WebPopupMenu controls; RadioButton desktop control