ASP.NET RadioButtonList control

Suggested Videos
Part 24 - ASP.NET CheckBoxList, select or deselect all list items
Part 25 - ASP.NET ListBox control
Part 26 - ASP.NET CheckBoxList and ListBox real time example

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);
}

No comments