How to use ASP.NET RadioButtonList Control

In ASP.NET there are several list controls, like
1. DropDownList
2. CheckBoxList
3. BulletedList
4. ListBox
5. RadioButtonList

In this video we will learn about asp.net RadioButtonList control. Just like every other list control
1. RadioButtonList is also a collection of ListItem objects.
2. Items can be added to the RadioButtonList in the HTML source or in the code behind file
3. RadioButtonList like any other list control supports databinding. For example, RadioButtonList can be bound to a database table or an xml file 
CheckBoxList is generally used, when you want to present the user with multiple choices, from which you want him to select one or more options. Where as if you want the user to select only one option, then a RadioButtonList control can be used, i.e RadioButtonList is commonly used to present mutually exclusive choices.

Create an asp.net web application. Copy and paste the following HTML
<asp:RadioButtonList ID="ColorRadioButtonList" runat="server" 
    RepeatDirection="Horizontal">
    <asp:ListItem Text="Red" Value="1"></asp:ListItem>
    <asp:ListItem Text="Green" Value="2"></asp:ListItem>
    <asp:ListItem Text="Blue" Value="3"></asp:ListItem>
    <asp:ListItem Text="Orange" Value="4"></asp:ListItem>
</asp:RadioButtonList>
<br />
<asp:Button ID="btnSubmit" runat="server" Text="Submit" 
    onclick="btnSubmit_Click"/>&nbsp;
<asp:Button ID="btnClearSelection" runat="server" Text="Clear Selection" 
    onclick="btnClearSelection_Click"/> 
Copy and paste the following code in your code-behind page
protected void btnSubmit_Click(object sender, EventArgs e)
{
    // If the user has made a choice
    if (ColorRadioButtonList.SelectedIndex != -1)
    {
        Response.Write("Text = " + ColorRadioButtonList.SelectedItem.Text + "<br/>");
        Response.Write("Value = " + ColorRadioButtonList.SelectedItem.Value + "<br/>");
        Response.Write("Index = " + ColorRadioButtonList.SelectedIndex.ToString());
    }
    // If the user has not selected anything
    else
    {
        Response.Write("Please select your favourite color");
    }
}

protected void btnClearSelection_Click(object sender, EventArgs e)
{
    // Clear the user selection
    ColorRadioButtonList.SelectedIndex = -1;
}

RadioButtonList Example
 

By default, the ListItem objects are laid out in vertical direction. If you want to change the direction, use RepeatDirection property
<asp:RadioButtonList ID="ColorRadioButtonList" runat="server"RepeatDirection="Horizontal">

RepeatColumns property specifies the number of columns used to lay out the items.

RepeatLayout property, specifies the layout to be used by each list item. The following are the values allowed by RepeatLayout property
1. Table
2. Flow
3. OrderedList
4. UnorderedList

Please note that the, OrderedList and UnorderedList layouts are only supported, if the RepeatDirection is vertical.

Set the Enabled property of the ListItem object to false, to disable the selection, in the RadioButtonList control.

To retrieve the Text of the selected item, SelectedItem.Text property can be used. SelectedItem will be NULL, if nothing is selected, and hence, calling Text and Value properties may cause NullReferenceException. Hence, it is important to check for null, when using SelectedItem property of a RadioButtonList control.
if (ColorRadioButtonList.SelectedItem != null)
{
    Response.Write(ColorRadioButtonList.SelectedItem.Text);
}

NullReferenceException can also be avoided, using the SelectedIndex property
if (ColorRadioButtonList.SelectedIndex != -1)
{
    Response.Write(ColorRadioButtonList.SelectedItem.Text);
} 

Do you want more TechChaitu Updates ?

Enter your email address: