RadioButtonList within a GridView using the AJAX UpdatePanel

rafaelbelliard

This simple but extremely useful trick explains how to hande a radiobutton within an ASP.NET gridview, without having to fiddle around with the sometimes cumbersome beast that javascript is. To avoid postbacks, we'll be using ASP.NET AJAX's updatepanel.

Basically, the logic is grabbing the sender (ie, the radiobutton checked), disabling every button currently checked, then checking the sender button.

536 Views
About the Author

My name is Rafael Belliard, and I am simply an enthusiastic software developer of Christian faith who can be regularly found listening to music while coding my way out of everything. I am currently employed by an Oracle IT consulting company working on ASP.NET development.

// ASP.NET
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="DemoWebsite.Default" %>

<!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 runat="server">
    <title>RadioButton Demo</title>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <asp:ScriptManager ID="scriptManager" runat="server" />
        <asp:UpdatePanel ID="UpdatePanel1" runat="server">
            <ContentTemplate>
                            <asp:GridView ID="gvAnswers" runat="server">
                                <Columns>
                                    <asp:TemplateField ItemStyle-Width="20px">
                                        <ItemTemplate>
                                            <asp:RadioButton ID="rbAnswers" runat="server" 
                                                OnCheckedChanged="RbAnswersCheckedChanged" 
                                                AutoPostBack="true"/>
                                        </ItemTemplate>
                                    </asp:TemplateField>
                                </Columns>
                            </asp:GridView>
                            <asp:Label ID="label1" runat="server" />
            </ContentTemplate>
        </asp:UpdatePanel>
    </div>
    </form>
</body>
</html>

// C# code-behind 
using System;
using System.Collections.Generic;
using System.Web.UI;
using System.Web.UI.WebControls;

namespace DemoWebsite
{
    public partial class Default : Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {
            if (!Page.IsPostBack)
            {
                // The data source to test against
                List<string> source = new List<string>
                                          {
                                              "One", "Two","Three",
                                              "Four","Five","Six",
                                              "Seven","Eight","Nine"
                                          };
                gvAnswers.DataSource = source;
                gvAnswers.DataBind();
            }
        }

        protected void RbAnswersCheckedChanged(object sender, EventArgs e)
        {
            // Unchecks previously selected rows
            foreach (GridViewRow oldrow in gvAnswers.Rows)
            {
                ((RadioButton)oldrow.FindControl("rbAnswers")).Checked = false;
            }

            // Checks the new row
            RadioButton rb = (RadioButton)sender;
            GridViewRow row = (GridViewRow)rb.NamingContainer;
            ((RadioButton)row.FindControl("rbAnswers")).Checked = true;
        }
    }
}
Member Avatar
h4ng4r18

Thank You :)!

Be a part of the DaniWeb community

We're a friendly, industry-focused community of 1.21 million developers, IT pros, digital marketers, and technology enthusiasts learning and sharing knowledge.