RadioButtonList Web Server Control Declarative Syntax

Article
11/03/2006

Creates a group of radio buttons. This control supports binding to a data source.

<asp:RadioButtonList
    AccessKey="string"
    AppendDataBoundItems="True|False"
    AutoPostBack="True|False"
    BackColor="color name|#dddddd"
    BorderColor="color name|#dddddd"
    BorderStyle="NotSet|None|Dotted|Dashed|Solid|Double|Groove|Ridge|
        Inset|Outset"
    BorderWidth="size"
    CausesValidation="True|False"
    CellPadding="integer"
    CellSpacing="integer"
    CssClass="string"
    DataMember="string"
    DataSource="string"
    DataSourceID="string"
    DataTextField="string"
    DataTextFormatString="string"
    DataValueField="string"
    Enabled="True|False"
    EnableTheming="True|False"
    EnableViewState="True|False"
    Font-Bold="True|False"
    Font-Italic="True|False"
    Font-Names="string"
    Font-Overline="True|False"
    Font-Size="string|Smaller|Larger|XX-Small|X-Small|Small|Medium|
        Large|X-Large|XX-Large"
    Font-Strikeout="True|False"
    Font-Underline="True|False"
    ForeColor="color name|#dddddd"
    Height="size"
    ID="string"
    OnDataBinding="DataBinding event handler"
    OnDataBound="DataBound event handler"
    OnDisposed="Disposed event handler"
    OnInit="Init event handler"
    OnLoad="Load event handler"
    OnPreRender="PreRender event handler"
    OnSelectedIndexChanged="SelectedIndexChanged event handler"
    OnTextChanged="TextChanged event handler"
    OnUnload="Unload event handler"
    RepeatColumns="integer"
    RepeatDirection="Horizontal|Vertical"
    RepeatLayout="Table|Flow"
    runat="server"
    SelectedIndex="integer"
    SelectedValue="string"
    SkinID="string"
    Style="string"
    TabIndex="integer"
    TextAlign="Left|Right"
    ToolTip="string"
    ValidationGroup="string"
    Visible="True|False"
    Width="size"
>
            <asp:ListItem
                Enabled="True|False"
                Selected="True|False"
                Text="string"
                Value="string"
            />
</asp:RadioButtonList>

Remarks

The RadioButtonList control allows you to create a single-selection radio button group that can be dynamically generated by binding to a data source. To specify the items that you want to appear in the RadioButtonList control, place a ListItem element for each entry between the opening and closing tags of the RadioButtonList control.

Note
You can also use the RadioButton control. The RadioButtonList control is easier for creating a set of radio buttons using data binding, while an individual RadioButton control gives you greater control over layout.

The RadioButtonList control also supports data binding. To bind the control to a data source, first create a data source, such as a ArrayList object, that contains the items to display in the control. Next, use the DataBind method to bind the data source to the RadioButtonList control. Use the DataTextField and DataValueField properties to specify which field in the data source to bind to the Text and Value properties, respectively, of each list item in the control. The RadioButtonList control will now display the information from the data source.

To determine the selected items in the RadioButtonList control, iterate through the Items collection and test the Selected property of each item in the collection.

You can specify the rendering of the list with the RepeatLayout and RepeatDirection properties. If RepeatLayout is set to Table (the default setting), the list will be rendered within a table. If it is set to Flow, the list will be rendered without any tabular structure. By default, RepeatDirection is set to Vertical. Setting this property to Horizontal will render the list horizontally.

Caution
Text is not HTML encoded before it is displayed in the RadioButtonList control. This makes it possible to embed script within HTML tags in the text. If the values for the control come from user input, be sure to validate the values to help prevent security vulnerabilities.

For detailed information on the RadioButtonList Web server control's properties and events, see the RadioButtonList class documentation.

Example

The following example demonstrates how to use a RadioButtonList control to display a set of mutually exclusive options to the user.

<%@ Page Language="VB" AutoEventWireup="True" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
 <head>
    <title>RadioButtonList Example</title>
<script language="VB" runat="server">

    Sub Button1_Click(Source As Object, e As EventArgs)
        If RadioButtonList1.SelectedIndex > - 1 Then
            Label1.Text = "You selected: " & RadioButtonList1.SelectedItem.Text
        End If
    End Sub

    Sub chkLayout_CheckedChanged(sender As Object, e As EventArgs)        
        If chkLayout.Checked = True Then
            RadioButtonList1.RepeatLayout = RepeatLayout.Table
        Else
            RadioButtonList1.RepeatLayout = RepeatLayout.Flow
        End If
    End Sub

    Sub chkDirection_CheckedChanged(sender As Object, e As EventArgs)        
        If chkDirection.Checked = True Then
            RadioButtonList1.RepeatDirection = RepeatDirection.Horizontal
        Else
            RadioButtonList1.RepeatDirection = RepeatDirection.Vertical
        End If
    End Sub
 
     </script>
 
 </head>
 <body>
 
     <h3>RadioButtonList Example</h3>
 
     <form id="form1" runat="server">
 
         <asp:RadioButtonList id="RadioButtonList1" runat="server">
            <asp:ListItem>Item 1</asp:ListItem>
            <asp:ListItem>Item 2</asp:ListItem>
            <asp:ListItem>Item 3</asp:ListItem>
            <asp:ListItem>Item 4</asp:ListItem>
            <asp:ListItem>Item 5</asp:ListItem>
            <asp:ListItem>Item 6</asp:ListItem>
         </asp:RadioButtonList>
 
         <br />
         
         <asp:CheckBox id="chkLayout" OnCheckedChanged="chkLayout_CheckedChanged" Text="Display Table Layout" Checked="true" AutoPostBack="true" runat="server" />
 
         <br />
         
         <asp:CheckBox id="chkDirection" OnCheckedChanged="chkDirection_CheckedChanged" Text="Display Horizontally" AutoPostBack="true" runat="server" />
 
         <br />
         
         <asp:Button id="Button1" Text="Submit" onclick="Button1_Click" runat="server"/>
 
         <br />
         
         <asp:Label id="Label1" font-names="Verdana" font-size="8pt" runat="server"/>
 
     </form>
 
 </body>
 </html>

<%@ Page Language="C#" AutoEventWireup="True" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
 <head>
    <title>RadioButtonList Example</title>
<script language="C#" runat="server">
 
        void Button1_Click(object Source, EventArgs e) 
        {
           if (RadioButtonList1.SelectedIndex > -1) 
           {  
              Label1.Text = "You selected: " + RadioButtonList1.SelectedItem.Text;
           }
        }
 
        void chkLayout_CheckedChanged(Object sender, EventArgs e) 
        {
        
           if (chkLayout.Checked == true) 
           {
              RadioButtonList1.RepeatLayout = RepeatLayout.Table;
           }
           else 
           {
              RadioButtonList1.RepeatLayout = RepeatLayout.Flow;
           }     
        }
        
        void chkDirection_CheckedChanged(Object sender, EventArgs e) 
        {
        
           if (chkDirection.Checked == true) 
           {
              RadioButtonList1.RepeatDirection = RepeatDirection.Horizontal;
           }
           else 
           {
              RadioButtonList1.RepeatDirection = RepeatDirection.Vertical;
           }  
        }
 
     </script>
 
 </head>
 <body>
 
     <h3>RadioButtonList Example</h3>
 
     <form id="form1" runat="server">
 
         <asp:RadioButtonList id="RadioButtonList1" runat="server">
            <asp:ListItem>Item 1</asp:ListItem>
            <asp:ListItem>Item 2</asp:ListItem>
            <asp:ListItem>Item 3</asp:ListItem>
            <asp:ListItem>Item 4</asp:ListItem>
            <asp:ListItem>Item 5</asp:ListItem>
            <asp:ListItem>Item 6</asp:ListItem>
         </asp:RadioButtonList>
 
         <br />
         
         <asp:CheckBox id="chkLayout" OnCheckedChanged="chkLayout_CheckedChanged" Text="Display Table Layout" Checked="true" AutoPostBack="true" runat="server" />
 
         <br />
         
         <asp:CheckBox id="chkDirection" OnCheckedChanged="chkDirection_CheckedChanged" Text="Display Horizontally" AutoPostBack="true" runat="server" />
 
         <br />
         
         <asp:Button id="Button1" Text="Submit" onclick="Button1_Click" runat="server"/>
 
         <br />
         
         <asp:Label id="Label1" font-names="Verdana" font-size="8pt" runat="server"/>
 
     </form>
 
 </body>
 </html>

<%@ Page Language="JScript" AutoEventWireup="True" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
 <head>
    <title>RadioButtonList Example</title>
<script language="JScript" runat="server">
 
        function Button1_Click(Source : System.Object, e : EventArgs) 
        {
           if (RadioButtonList1.SelectedIndex > -1) 
           {  
              Label1.Text = "You selected: " + RadioButtonList1.SelectedItem.Text;
           }
        }
 
        function chkLayout_CheckedChanged(sender : System.Object, e : EventArgs) 
        {
        
           if (chkLayout.Checked == true) 
           {
              RadioButtonList1.RepeatLayout = RepeatLayout.Table;
           }
           else 
           {
              RadioButtonList1.RepeatLayout = RepeatLayout.Flow;
           }     
        }
        
        function chkDirection_CheckedChanged(sender : System.Object, e : EventArgs) 
        {
        
           if (chkDirection.Checked == true) 
           {
              RadioButtonList1.RepeatDirection = RepeatDirection.Horizontal;
           }
           else 
           {
              RadioButtonList1.RepeatDirection = RepeatDirection.Vertical;
           }  
        }
 
     </script>
 
 </head>
 <body>
 
     <h3>RadioButtonList Example</h3>
 
     <form id="form1" runat="server">
 
         <asp:RadioButtonList id="RadioButtonList1" runat="server">
            <asp:ListItem>Item 1</asp:ListItem>
            <asp:ListItem>Item 2</asp:ListItem>
            <asp:ListItem>Item 3</asp:ListItem>
            <asp:ListItem>Item 4</asp:ListItem>
            <asp:ListItem>Item 5</asp:ListItem>
            <asp:ListItem>Item 6</asp:ListItem>
         </asp:RadioButtonList>
 
         <br />
         
         <asp:CheckBox id="chkLayout" OnCheckedChanged="chkLayout_CheckedChanged" Text="Display Table Layout" Checked="true" AutoPostBack="true" runat="server" />
 
         <br />
         
         <asp:CheckBox id="chkDirection" OnCheckedChanged="chkDirection_CheckedChanged" Text="Display Horizontally" AutoPostBack="true" runat="server" />
 
         <br />
         
         <asp:Button id="Button1" Text="Submit" onclick="Button1_Click" runat="server"/>
 
         <br />
         
         <asp:Label id="Label1" font-name="Verdana" font-size="8pt" runat="server"/>
 
     </form>
 
 </body>
 </html>

Share via

RadioButtonList Web Server Control Declarative Syntax

Remarks

Example

See Also

Reference

Other Resources

Additional resources