We are using a checkbox inside a GridView and a button. The User selects the row from the checkbox that he want to delete and on a button click it is deleted from the GridView and from the database too.

Initial chamber

Step 1

Open Visual Studio 2010 and create an Empty Website, provide a suitable name (Gridview_demo).

Step 2

In Solution Explorer you get your empty website. Add a web form and a SQL Database as in the following.

For Web Form:

Gridview_demo (your empty website) then right-click then select Add New Item -> Web Form. Name it Gridview_demo.aspx.

For SQL Server Database:

Gridview_demo (your empty website) then right-click then select Add New Item -> SQL Server Database. (Add the database inside the App_Data_folder.)

Database chamber

Step 3

In the database (Database.mdf) we will create a table, tbl_Data. Go to the database.mdf -> Table then Add New table, design your table like this:

Table -> tbl_data (Don't forget to make ID -> Identity Specification -> Yes)

table design

Design chamber

Step 4

Now open your Gridview_demo.aspx file, where we create our simple design with the GridView and a button.

Gridview_demo.aspx

  1. <%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
  3. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  5. <html xmlns="http://www.w3.org/1999/xhtml">
  6. <head runat="server">
  7. <title></title>
  8. </head>
  9. <body>
  10. <form id="form1" runat="server">
  11. <div>
  13. <table style="width:100%;">
  14. <tr>
  15. <td>
  16. </td>
  17. <td>
  18. </td>
  19. <td>
  20. </td>
  21. </tr>
  22. <tr>
  23. <td>
  24. </td>
  25. <td>
  26. <asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False"
  27. DataKeyNames="id">
  28. <Columns>
  29. <asp:TemplateField HeaderText="Student_ID">
  30. <EditItemTemplate>
  31. <asp:TextBox ID="TextBox1" runat="server" Text='<%# Bind("id") %>'></asp:TextBox>
  32. </EditItemTemplate>
  33. <ItemTemplate>
  34. <asp:Label ID="Label1" runat="server" Text='<%# Bind("id") %>'></asp:Label>
  35. </ItemTemplate>
  36. </asp:TemplateField>
  37. <asp:TemplateField HeaderText="Student_Name">
  38. <EditItemTemplate>
  39. <asp:TextBox ID="TextBox2" runat="server" Text='<%# Bind("name") %>'></asp:TextBox>
  40. </EditItemTemplate>
  41. <ItemTemplate>
  42. <asp:Label ID="Label2" runat="server" Text='<%# Bind("name") %>'></asp:Label>
  43. </ItemTemplate>
  44. </asp:TemplateField>
  45. <asp:TemplateField HeaderText="Student_City">
  46. <EditItemTemplate>
  47. <asp:TextBox ID="TextBox3" runat="server" Text='<%# Bind("city") %>'></asp:TextBox>
  48. </EditItemTemplate>
  49. <ItemTemplate>
  50. <asp:Label ID="Label3" runat="server" Text='<%# Bind("city") %>'></asp:Label>
  51. </ItemTemplate>
  52. </asp:TemplateField>
  53. <asp:TemplateField>
  54. <EditItemTemplate>
  55. <asp:CheckBox ID="CheckBox1" runat="server" />
  56. </EditItemTemplate>
  57. <ItemTemplate>
  58. <asp:CheckBox ID="CheckBox1" runat="server" />
  59. </ItemTemplate>
  60. </asp:TemplateField>
  61. </Columns>
  62. </asp:GridView>
  63. </td>
  64. <td>
  65. </td>
  66. </tr>
  67. <tr>
  68. <td>
  69. </td>
  70. <td>
  71. <asp:Button ID="Button1" runat="server" onclick="Button1_Click" Text="Button" />
  72. </td>
  73. <td>
  74. </td>
  75. </tr>
  76. </table>
  78. </div>
  79. </form>
  80. </body>
  81. </html>
For inserting the checkbox inside the GridView, click on the arrow button of the GridView where you can find Edit Column. In a new window (Fields) you need Checkbox Fields from the Available Fields.

Checkbox Fields

Here is what the design looks like:

design

Code chamber

Step 5

Open your Gridview_demo.aspx.cs and write some code so that the application works.

Gridview_demo.cs
  1. using System;
  2. using System.Collections.Generic;
  3. using System.Linq;
  4. using System.Web;
  5. using System.Web.UI;
  6. using System.Web.UI.WebControls;
  7. using System.Data;
  8. using System.Data.SqlClient;
  10. public partial class _Default : System.Web.UI.Page
  11. {
  13. SqlConnection con = new SqlConnection(@"Data Source=.\SQLEXPRESS;AttachDbFilename=|DataDirectory|\Database.mdf;Integrated Security=True;User Instance=True");
  14. protected void Page_Load(object sender, EventArgs e)
  15. {
  16. if (!Page.IsPostBack)
  17. {
  18. refreshdata();
  19. }
  20. }
  22. public void refreshdata()
  23. {
  26. SqlCommand cmd = new SqlCommand("select * from tbl_data", con);
  27. SqlDataAdapter sda = new SqlDataAdapter(cmd);
  28. DataTable dt = new DataTable();
  29. sda.Fill(dt);
  30. GridView1.DataSource = dt;
  31. GridView1.DataBind();
  33. }
  35. protected void Button1_Click(object sender, EventArgs e)
  36. {
  38. foreach (GridViewRow gvrow in GridView1.Rows)
  39. {
  41. CheckBox chck = gvrow.FindControl("CheckBox1") as CheckBox;
  42. if (chck.Checked)
  43. {
  44. var Label = gvrow.FindControl("Label1") as Label;
  46. SqlCommand cmd = new SqlCommand("delete from tbl_data where id=@id",con);
  47. cmd.Parameters.AddWithValue("id", int.Parse(Label.Text));
  48. con.Open();
  49. int id = cmd.ExecuteNonQuery();
  50. con.Close();
  51. refreshdata();
  54. }
  55. }
  58. }
  59. }


Output chamber

gridview

Don't worry about the Id's that start from 4—8 since I used 1-4 Ids for testing.

delet select row

I hope you like it . Thank you for reading. Have a good day.