In this tutorial, we'll explore how to implement the functionality of deleting selected rows in a GridView using CheckBox and Button controls in ASP.NET. This approach allows users to conveniently select multiple rows for deletion, providing an intuitive and user-friendly experience.
Designing the Page
Let's start by designing the ASP.NET page with the necessary controls and a stylish layout for clarity and appeal. The page includes a GridView, a Delete button, and a Label for displaying messages.
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="DeleteGridviewSelectedRowFromOutsideButton.aspx.cs" Inherits="DeleteGridviewSelectedRowFromOutsideButton" %>
<!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></title>
</head>
<body>
<form id="form1" runat="server">
<div>
<table style="border-collapse:collapse;">
<tr>
<th colspan="3" style="padding:10px 15px 10px 15px; border:1px solid #dddddd; background-color:Purple; color:#ffffff; text-align:left;">Delete Gridview Selected Row from Outsite Button </th>
</tr>
<tr>
<td colspan="3" style="padding:10px 15px 10px 15px; border:1px solid #dddddd; height:150px;">
<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False"
BackColor="White" BorderColor="#CC9966" BorderStyle="None" BorderWidth="1px"
CellPadding="4">
<Columns>
<asp:TemplateField>
<ItemTemplate>
<asp:CheckBox ID="CheckBox12" runat="server" />
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Emp ID">
<EditItemTemplate>
<asp:TextBox ID="TextBox1" runat="server" Text='<%# Bindundefined"empid") %>'></asp:TextBox>
</EditItemTemplate>
<ItemTemplate>
<asp:Label ID="Label1" runat="server" Text='<%# Bindundefined"empid") %>'></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Emp Name">
<EditItemTemplate>
<asp:TextBox ID="TextBox2" runat="server" Text='<%# Bindundefined"empname") %>'></asp:TextBox>
</EditItemTemplate>
<ItemTemplate>
<asp:Label ID="Label2" runat="server" Text='<%# Bindundefined"empname") %>'></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Emp Salary">
<EditItemTemplate>
<asp:TextBox ID="TextBox3" runat="server" Text='<%# Bindundefined"empsal") %>'></asp:TextBox>
</EditItemTemplate>
<ItemTemplate>
<asp:Label ID="Label3" runat="server" Text='<%# Bindundefined"empsal") %>'></asp:Label>
</ItemTemplate>
</asp:TemplateField>
</Columns>
<FooterStyle BackColor="#FFFFCC" ForeColor="#330099" />
<HeaderStyle BackColor="#990000" Font-Bold="True" ForeColor="#FFFFCC" />
<PagerStyle BackColor="#FFFFCC" ForeColor="#330099" HorizontalAlign="Center" />
<RowStyle BackColor="White" ForeColor="#330099" />
<SelectedRowStyle BackColor="#FFCC66" Font-Bold="True" ForeColor="#663399" />
<SortedAscendingCellStyle BackColor="#FEFCEB" />
<SortedAscendingHeaderStyle BackColor="#AF0101" />
<SortedDescendingCellStyle BackColor="#F6F0C0" />
<SortedDescendingHeaderStyle BackColor="#7E0000" />
</asp:GridView>
</td>
</tr>
<tr>
<td colspan="3" style="padding:10px 15px 10px 15px; border:1px solid #dddddd;">
<asp:Button ID="btn_Delete" Text="Delete" runat="server"
onclick="btn_Delete_Click" />
<asp:Label ID="lblerror" runat="server"></asp:Label>
</td>
</tr>
</table>
</div>
</form>
</body>
</html>
C# Coding
Now, let's delve into the C# code-behind to handle the page load, bind the GridView, and implement the logic for deleting selected rows.
Namespace and Page Load Event:
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Data;
using System.Data.SqlClient;
public partial class DeleteGridviewSelectedRowFromOutsideButton : System.Web.UI.Page
{
SqlConnection con = new SqlConnection("Data Source=.; User id=sa; password=tiger; Database=master;");
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
FillGridview();
}
}
}
Binding the GridView:
private void FillGridview()
{
SqlDataAdapter da=new SqlDataAdapter("Select * from emp", con);
DataSet ds = new DataSet();
da.Fill(ds);
GridView1.DataSource = ds;
GridView1.DataBind();
}
Delete Button Click Event
protected void btn_Delete_Click(object sender, EventArgs e)
{
foreach (GridViewRow row in GridView1.Rows)
{
if (((CheckBox)row.FindControl("CheckBox12")).Checked)
{
string empid = ((Label)row.FindControl("Label1")).Text.Trim();
lblerror.Text = empid;
con.Open();
SqlCommand cmd = new SqlCommand("Delete emp where empid='" + empid + "'", con);
int i = cmd.ExecuteNonQuery();
if (i > 0)
{
lblerror.Text = "Deleted Employee : " + empid + " Successfully...";
}
con.Close();
FillGridview();
}
}
}
}
Conclusion
By following this step-by-step guide, you've learned how to create a dynamic and interactive ASP.NET page that allows users to delete selected rows from a GridView using CheckBox and Button controls. This functionality enhances the user experience and provides a practical approach to managing data in web applications. Feel free to customize the design and logic to suit the specific requirements of your project. Happy coding!
0 Comments