How to: Set Layout in a RadioButtonList Web Server Control

By default, the RadioButtonList Web server control displays a single column of buttons. However, you can specify any number of columns, and within the columns, you can specify how the items are ordered: vertically (the default) or horizontally. Vertical layout in three columns results in a layout such as the following:

A    D    G
B    E    H
C    F

Horizontal layout for the same items results in the following layout:

A    B    C
D    E    F
G    H

Note

If you are working with individual RadioButton Web server controls, you do not set layout as a property of the control. Instead, you set it by simply adding the radio buttons within the page flow. For details about the differences between these controls, see RadioButton and RadioButtonList Web Server Controls Overview.

To specify column count and ordering

1. Set the RadioButtonList control's RepeatColumns property to the number of columns you want.

2. Set the RepeatDirection property to Vertical or Horizontal using the RepeatDirection enumeration, as shown in the following code example.

   Protected Sub Button1_Click(ByVal sender As Object, _
           ByVal e As System.EventArgs) Handles Button1.Click
      ' Create five radio buttons.
      Dim colors() As String = _
         New String() {"Red", "Blue", "Green", "Yellow", "Orange"}
      RadioButtonList1.Items.Clear()
      Dim i As Integer
      For i = 0 To ubound(colors)
         RadioButtonList1.Items.Add(colors(i))
      Next
      ' Lay out the radio buttons horizontally.
      RadioButtonList1.RepeatDirection = RepeatDirection.Horizontal
   End Sub
   

   protected void Button1_Click (object sender, System.EventArgs e)
   {
      // Create five radio buttons.
      string[] colors = {"Red", "Blue", "Green", "Yellow", "Orange"};
      this.RadioButtonList1.Items.Clear();
      for(int i=0;i < colors.GetLength(0);i++){
         this.RadioButtonList1.Items.Add(colors[i]);
      }   
      // Lay out the radio buttons horizontally.
      this.RadioButtonList1.RepeatDirection = 
          RepeatDirection.Horizontal;
   }
   

See Also

Reference

RadioButton and RadioButtonList Web Server Controls Overview