In this article I will explain how to use ASP.Net RadioButtonList control in Edit ItemTemplate of GridView control
Database
For this article I will make use of the Microsoft’s Northwind database. You can download and install it using the link below
I’ll make use the Customers, Orders and Shippers table for this article’s sample.
HTML Markup
The HTML Markup is simple it consist of an ASP.Net GridView control for which I have enabled Edit and Update and in RadioButtonList control inside GridView EditItemTemplate
<asp:GridView ID="gvOrders" DataKeyNames="OrderId" runat="server" AutoGenerateColumns="false"
OnRowEditing="EditCustomer" OnRowDataBound="RowDataBound" OnRowUpdating="UpdateCustomer"
CssClass="Grid" OnRowCancelingEdit="CancelEdit">
<Columns>
<asp:BoundField DataField="ContactName" HeaderText="Customer Name" ReadOnly="true" />
<asp:BoundField DataField="ShipCity" HeaderText="Ship City" ReadOnly="true" />
<asp:TemplateField HeaderText="Shipper">
<ItemTemplate>
<asp:Label ID="lblShipper" runat="server" Text='<%# Eval("CompanyName")%>'></asp:Label>
</ItemTemplate>
<EditItemTemplate>
<asp:Label ID="lblShipper" runat="server" Text='<%# Eval("ShipperId")%>' Visible="false"></asp:Label>
<asp:RadioButtonList ID="rblShippers" runat="server">
</asp:RadioButtonList>
</EditItemTemplate>
</asp:TemplateField>
<asp:CommandField ShowEditButton="True" />
</Columns>
</asp:GridView>
Namespaces
You will need to import the following namespaces
C#
using System.Data;
using System.Data.SqlClient;
using System.Configuration;
VB.Net
Imports System.Data
Imports System.Data.SqlClient
Imports System.Configuration
Populating and binding ASP.Net GridView with records
Below is the code to populate and bind the ASP.Net GridView control using the records Orders table joined with the Customers and Shippers table. The GridView is populated in the Page_Load event of the page
C#
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
this.BindData();
}
}
private void BindData()
{
string query = "SELECT TOP 10 OrderId, ShipCity, Shippers.ShipperId, Shippers.CompanyName, Customers.ContactName FROM Orders";
query += " INNER JOIN Shippers ON Orders.ShipVia = Shippers.ShipperId";
query += " INNER JOIN Customers ON Orders.CustomerId = Customers.CustomerId";
query += " ORDER BY ShippedDate DESC";
SqlCommand cmd = new SqlCommand(query);
gvOrders.DataSource = GetData(cmd);
gvOrders.DataBind();
}
private DataTable GetData(SqlCommand cmd)
{
string strConnString = ConfigurationManager.ConnectionStrings["conString"].ConnectionString;
using (SqlConnection con = new SqlConnection(strConnString))
{
using (SqlDataAdapter sda = new SqlDataAdapter())
{
cmd.Connection = con;
sda.SelectCommand = cmd;
using (DataTable dt = new DataTable())
{
sda.Fill(dt);
return dt;
}
}
}
}
VB.Net
Protected Sub Page_Load(sender As Object, e As EventArgs) Handles Me.Load
If Not IsPostBack Then
Me.BindData()
End If
End Sub
Private Sub BindData()
Dim query As String = "SELECT top 10 OrderId, ShipCity, Shippers.ShipperId, Shippers.CompanyName, Customers.ContactName FROM Orders"
query += " INNER JOIN Shippers ON Orders.ShipVia = Shippers.ShipperId"
query += " INNER JOIN Customers ON Orders.CustomerId = Customers.CustomerId"
query += " ORDER BY ShippedDate DESC"
Dim cmd As New SqlCommand(query)
gvOrders.DataSource = GetData(cmd)
gvOrders.DataBind()
End Sub
Private Function GetData(cmd As SqlCommand) As DataTable
Dim strConnString As String = ConfigurationManager.ConnectionStrings("conString").ConnectionString
Using con As New SqlConnection(strConnString)
Using sda As New SqlDataAdapter()
cmd.Connection = con
sda.SelectCommand = cmd
Using dt As New DataTable()
sda.Fill(dt)
Return dt
End Using
End Using
End Using
End Function
Editing the GridView Row
The below events handle the GridView Row Edit and Cancel Edit Events
C#
protected void EditCustomer(object sender, GridViewEditEventArgs e)
{
gvOrders.EditIndex = e.NewEditIndex;
this.BindData();
}
protected void CancelEdit(object sender, GridViewCancelEditEventArgs e)
{
gvOrders.EditIndex = -1;
BindData();
}
VB.Net
Protected Sub EditCustomer(sender As Object, e As GridViewEditEventArgs)
gvOrders.EditIndex = e.NewEditIndex
Me.BindData()
End Sub
Protected Sub CancelEdit(sender As Object, e As GridViewCancelEditEventArgs)
gvOrders.EditIndex = -1
BindData()
End Sub
![Populate ASP.Net RadioButtonList with Selected Value in Edit ItemTemplate of GridView and save to database]()
Binding the RadioButtonList inside GridView Edit ItemTemplate
The RadioButtonList has to be bind in the RowDataBound event of the ASP.Net GridView control in the following way. I have kept an invisible Label in order to get the previously stored ShipperId.
C#
protected void RowDataBound(object sender, GridViewRowEventArgs e)
{
if (e.Row.RowType == DataControlRowType.DataRow && gvOrders.EditIndex == e.Row.RowIndex)
{
RadioButtonList rblShippers = (RadioButtonList)e.Row.FindControl("rblShippers");
string query = "SELECT * FROM Shippers";
SqlCommand cmd = new SqlCommand(query);
rblShippers.DataSource = GetData(cmd);
rblShippers.DataTextField = "CompanyName";
rblShippers.DataValueField = "ShipperId";
rblShippers.DataBind();
rblShippers.Items.FindByValue((e.Row.FindControl("lblShipper") as Label).Text).Selected = true;
}
}
VB.Net
Protected Sub RowDataBound(sender As Object, e As GridViewRowEventArgs)
If e.Row.RowType = DataControlRowType.DataRow AndAlso gvOrders.EditIndex = e.Row.RowIndex Then
Dim rblShippers As RadioButtonList = DirectCast(e.Row.FindControl("rblShippers"), RadioButtonList)
Dim query As String = "SELECT * FROM Shippers"
Dim cmd As New SqlCommand(query)
rblShippers.DataSource = GetData(cmd)
rblShippers.DataTextField = "CompanyName"
rblShippers.DataValueField = "ShipperId"
rblShippers.DataBind()
rblShippers.Items.FindByValue(TryCast(e.Row.FindControl("lblShipper"), Label).Text).Selected = True
End If
End Sub
![Populate ASP.Net RadioButtonList with Selected Value in Edit ItemTemplate of GridView and save to database]()
Updating the GridView Row using RadioButtonList and saving the updated value in database
Finally here’s the code to update the record with the new selected value from the ASP.Net RadioButtonList control.
C#
protected void UpdateCustomer(object sender, GridViewUpdateEventArgs e)
{
string shipperId = (gvOrders.Rows[e.RowIndex].FindControl("rblShippers") as RadioButtonList).SelectedItem.Value;
string orderId = gvOrders.DataKeys[e.RowIndex].Value.ToString();
string strConnString = ConfigurationManager.ConnectionStrings["conString"].ConnectionString;
using (SqlConnection con = new SqlConnection(strConnString))
{
string query = "UPDATE Orders SET Shipvia = @ShipperId WHERE OrderId = @OrderId";
using (SqlCommand cmd = new SqlCommand(query))
{
cmd.Connection = con;
cmd.Parameters.AddWithValue("@OrderId", orderId);
cmd.Parameters.AddWithValue("@ShipperId", shipperId);
con.Open();
cmd.ExecuteNonQuery();
con.Close();
Response.Redirect(Request.Url.AbsoluteUri);
}
}
}
VB.Net
Protected Sub UpdateCustomer(sender As Object, e As GridViewUpdateEventArgs)
Dim shipperId As String = TryCast(gvOrders.Rows(e.RowIndex).FindControl("rblShippers"), RadioButtonList).SelectedItem.Value
Dim orderId As String = gvOrders.DataKeys(e.RowIndex).Value.ToString()
Dim strConnString As String = ConfigurationManager.ConnectionStrings("conString").ConnectionString
Using con As New SqlConnection(strConnString)
Dim query As String = "UPDATE Orders SET Shipvia = @ShipperId WHERE OrderId = @OrderId"
Using cmd As New SqlCommand(query)
cmd.Connection = con
cmd.Parameters.AddWithValue("@OrderId", orderId)
cmd.Parameters.AddWithValue("@ShipperId", shipperId)
con.Open()
cmd.ExecuteNonQuery()
con.Close()
Response.Redirect(Request.Url.AbsoluteUri)
End Using
End Using
End Sub
Demo
Downloads
