Delete Records From Gridview Using CheckBox in ASP.Net

This article shows how to delete multiple records from a GridView using a CheckBox in ASP.NET. This example is helpful in situations where an administrator or user must delete several records from the database. For demonstration I have created a database (named EmployeeDB) in which we have a table named Employee.

Table Schema used in this example:
  1. CREATE TABLE [dbo].[Employee] (  
  2.     [EmpId]     INT          NOT NULL,  
  3.     [FirstName] VARCHAR (20) NOT NULL,  
  4.     [LastName]  VARCHAR (20) NOT NULL,  
  5.     [City]      VARCHAR (20) NOT NULL,  
  6.     PRIMARY KEY CLUSTERED ([EmpId] ASC)  
  7. );  
Let's Begin.
  1. Drop a GridView Control from the toolbox and set AutoGenerateColumns to false.
  2. Add the Columns Collection (tag) that manages the collection of column fields.
  3. Add TemplateField inside the Columns Collection that is used to display custom content in a data-bound control.
  4. Add an ItemTemplate in the TemplateField that specifies the content to display for the items in a TemplateField.
  5. Add a CheckBox control inside the ItemTemplate.
  6. Inside the Columns tag, we have added a column field (BoundField) that displays the value of a field in a data source.
  7. Add a Button Control (ID="btnDeleteRecord) for deleting the selected/checked records. 
Default.aspx code:
  1. <form id="form1" runat="server">  
  2.     <div>  
  3.         <asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="false" CellPadding="4">  
  4.             <Columns>  
  5.                 <asp:TemplateField>  
  6.                     <ItemTemplate>  
  7.                         <asp:CheckBox ID="chkDel" runat="server" />  
  8.                     </ItemTemplate>  
  9.                 </asp:TemplateField>  
  10.                 <asp:BoundField DataField="EmpId" HeaderText="Emp Id" />  
  11.                 <asp:BoundField DataField="FirstName" HeaderText="First Name" />  
  12.                 <asp:BoundField DataField="LastName" HeaderText="Last Name" />  
  13.                 <asp:BoundField DataField="City" HeaderText="City" />  
  14.             </Columns>  
  15.             <HeaderStyle BackColor="#663300" ForeColor="#ffffff" />  
  16.             <RowStyle BackColor="#e7ceb6" />  
  17.         </asp:GridView>  
  18.         <br />  
  19.         <asp:Button ID="btnDeleteRecord" runat="server" BackColor="#E7CEB6" Height="32px" OnClick="btnDeleteRecord_Click" Text="Delete" Width="64px" />  
  20.         <br />  
  21.     </div>  
  22. </form>  
We have added JavaScript (a client-side script) so that when the user checks the CheckBox and clicks on the Delete button, a confirmation pop-up comes on the screen and on accepting the confirmation (by clicking on the OK button), a click event of the server-side control fires (btnDeleteRecord_Click) and deletes the checked record.
  1. <script type="text/javascript">  

  2.         function DeleteConfirm() 
  3.         {  
  4.             var Ans = confirm("Do you want to Delete Selected Employee Record?");  
  5.             if (Ans)
  6.             {  
  7.                 return true;  
  8.             }  
  9.             else 
  10.             {  
  11.                 return false;  
  12.             }  
  13.         }  
  14. </script>  
On Page_Load event, we disaply the data using the showData() method and add an onclick attribute (JavaScript) to the Delete button.

Default.aspx.cs code
  1. //connection string from web.config file  
  2. string cs = ConfigurationManager.ConnectionStrings["DBCS"].ConnectionString;  

  3. protected void Page_Load(object sender, EventArgs e)  
  4. {  
  5.     if(!IsPostBack)  
  6.     {  
  7.         //Displaying the Data  
  8.         showData();  
  9.         //Adding an Attribute to Server Control(i.e. btnDeleteRecord)  
  10.         btnDeleteRecord.Attributes.Add("onclick""javascript:return DeleteConfirm()");  
  11.     }  
  12. }
  13.   
  14. //Method for Displaying Data  
  15. protected void showData()  
  16. {  
  17.     DataTable dt = new DataTable();  
  18.     SqlConnection con = new SqlConnection(cs);  
  19.     SqlDataAdapter adapt = new SqlDataAdapter("select * from Employee",con);  
  20.     con.Open();  
  21.     adapt.Fill(dt);  
  22.     con.Close();  
  23.     GridView1.DataSource = dt;  
  24.     GridView1.DataBind();  
  25. }  
  26. //Method for Deleting Record  
  27. protected void DeleteRecord(int empid)  
  28. {  
  29.     SqlConnection con = new SqlConnection(cs);  
  30.     SqlCommand com = new SqlCommand("delete from Employee where EmpId=@ID",con);  
  31.     com.Parameters.AddWithValue("@ID",empid);  
  32.     con.Open();  
  33.     com.ExecuteNonQuery();  
  34.     con.Close();  
  35. }
  36.   
  37. protected void btnDeleteRecord_Click(object sender, EventArgs e)  
  38. {  
  39.     foreach (GridViewRow grow in GridView1.Rows)  
  40.     {  
  41.         //Searching CheckBox("chkDel") in an individual row of Grid  
  42.         CheckBox chkdel = (CheckBox)grow.FindControl("chkDel");  
  43.         //If CheckBox is checked than delete the record with particular empid  
  44.         if(chkdel.Checked)  
  45.         {  
  46.             int empid = Convert.ToInt32(grow.Cells[1].Text);  
  47.             DeleteRecord(empid);  
  48.         }  
  49.     }  
  50.     //Displaying the Data in GridView  
  51.     showData();  
  52. }  
Final Preview

 
 I hope you like it. Thanks.

Up Next
    Ebook Download
    View all
    Learn
    View all