Bind, Insert/Save, Edit, Update, Cancel, Delete, Paging in Grid View

Introduction

In this article I am going to explain How to perform Bind, Insert/Save, Edit, Update, Cancel, Delete, Paging in Grid View in asp.net using C# language.

Description: 

I have one gridview I need to write code to insert data into gridview after that I need to edit that grid view data and update it and if I want to delete the record in gridview we need to delete record simply by click on delete button of particular row to achieve these functionalities I have used some of grid view events those are 

1        Onrowcancelingedit

2        Onrowediting

3        Onrowupdating

4        Onrowcancelingedit

5        Onrowdeleting

By using above grid view events we can insert, edit, update and delete the data in grid view. My Question is how we can use these events in our coding before to see those details first design table in database and give name Customer

Aspx page grid code

<asp:GridView ID="GridView1" runat="server"  Width = "550px"

        AutoGenerateColumns = "False" Font-Names = "Arial"

        Font-Size = "11pt" AlternatingRowStyle-BackColor = "#C2D69B" 

        HeaderStyle-BackColor = "green" AllowPaging ="True"  ShowFooter = "True" 

        OnPageIndexChanging = "OnPaging" onrowediting="EditCustomer"

        onrowupdating="UpdateCustomer"  onrowcancelingedit="CancelEdit" CellPadding="4"

                ForeColor="#333333" GridLines="None" >

       <Columns>

        <asp:TemplateField ItemStyle-Width = "30px"  HeaderText = "CustomerID">

            <ItemTemplate>

                <asp:Label ID="lblCustomerID" runat="server" Text='<%# Eval("CustomerID")%>'></asp:Label>

            </ItemTemplate>

            <FooterTemplate>

                <asp:TextBox ID="txtCustomerID" Width = "40px" MaxLength = "5" runat="server"></asp:TextBox>

            </FooterTemplate>

            <ItemStyle Width="30px" />

        </asp:TemplateField>

        <asp:TemplateField ItemStyle-Width = "100px"  HeaderText = "Name">

            <ItemTemplate>

                <asp:Label ID="lblContactName" runat="server" Text='<%# Eval("ContactName")%>'></asp:Label>

            </ItemTemplate>

            <EditItemTemplate>

                <asp:TextBox ID="txtContactName" runat="server" Text='<%# Eval("ContactName")%>'></asp:TextBox>

            </EditItemTemplate> 

            <FooterTemplate>

                <asp:TextBox ID="txtContactName" runat="server"></asp:TextBox>

            </FooterTemplate>

            <ItemStyle Width="100px" />

        </asp:TemplateField>

        <asp:TemplateField ItemStyle-Width = "150px"  HeaderText = "Company">

            <ItemTemplate>

                <asp:Label ID="lblCompany" runat="server" Text='<%# Eval("CompanyName")%>'></asp:Label>

            </ItemTemplate>

            <EditItemTemplate>

                <asp:TextBox ID="txtCompany" runat="server" Text='<%# Eval("CompanyName")%>'></asp:TextBox>

            </EditItemTemplate> 

            <FooterTemplate>

                <asp:TextBox ID="txtCompany" runat="server"></asp:TextBox>

            </FooterTemplate>

            <ItemStyle Width="150px" />

        </asp:TemplateField>

        <asp:TemplateField>

            <ItemTemplate>

                <asp:LinkButton ID="lnkRemove" runat="server" CommandArgument = '<%# Eval("CustomerID")%>'

                 OnClientClick = "return confirm('Do you want to delete?')"

                Text = "Delete" OnClick = "DeleteCustomer"></asp:LinkButton>

            </ItemTemplate>

             <FooterTemplate>

                <asp:Button ID="btnAdd" runat="server" Text="Add" OnClick = "AddNewCustomer" />

            </FooterTemplate>

        </asp:TemplateField>

        <asp:CommandField  ShowEditButton="True" />

       </Columns>

       <AlternatingRowStyle BackColor="White"  />

           <EditRowStyle BackColor="#2461BF" />

           <FooterStyle BackColor="#507CD1" Font-Bold="True" ForeColor="White" />

           <HeaderStyle BackColor="#507CD1" Font-Bold="True" ForeColor="White" />

           <PagerStyle BackColor="#2461BF" ForeColor="White" HorizontalAlign="Center" />

           <RowStyle BackColor="#EFF3FB" />

           <SelectedRowStyle BackColor="#D1DDF1" Font-Bold="True" ForeColor="#333333" />

           <SortedAscendingCellStyle BackColor="#F5F7FB" />

           <SortedAscendingHeaderStyle BackColor="#6D95E1" />

           <SortedDescendingCellStyle BackColor="#E9EBEF" />

           <SortedDescendingHeaderStyle BackColor="#4870BE" />

    </asp:GridView>

Code Behind code for grid updating ,inserting , editing, fetching

Code to add new item

  string CustomerID = ((TextBox)GridView1.FooterRow.FindControl("txtCustomerID")).Text;

    string Name = ((TextBox)GridView1.FooterRow.FindControl("txtContactName")).Text;

    string Company = ((TextBox)GridView1.FooterRow.FindControl("txtCompany")).Text;

    SqlConnection con = new SqlConnection(strConnString);

    SqlCommand cmd = new SqlCommand();

    cmd.CommandType = CommandType.Text;

    cmd.CommandText = "insert into customers(ContactName, CompanyName) " +

    "values(@ContactName, @CompanyName);" +

     "select CustomerID, ContactName,CompanyName from customers";

   // cmd.Parameters.Add("@CustomerID", SqlDbType.VarChar).Value = CustomerID;

    cmd.Parameters.Add("@ContactName", SqlDbType.VarChar).Value = Name;

    cmd.Parameters.Add("@CompanyName", SqlDbType.VarChar).Value = Company;

    GridView1.DataSource = GetData(cmd);

    GridView1.DataBind();

Code to update existing items (Onrowupdating event)

string CustomerID = ((Label)GridView1.Rows[e.RowIndex].FindControl("lblCustomerID")).Text;

        string Name = ((TextBox)GridView1.Rows[e.RowIndex].FindControl("txtContactName")).Text;

        string Company = ((TextBox)GridView1.Rows[e.RowIndex].FindControl("txtCompany")).Text;

        SqlConnection con = new SqlConnection(strConnString);

        SqlCommand cmd = new SqlCommand();

        cmd.CommandType = CommandType.Text;

        cmd.CommandText = "update customers set ContactName=@ContactName,CompanyName=@CompanyName " +

         "where CustomerID=@CustomerID;" +

         "select CustomerID,ContactName,CompanyName from customers";

        cmd.Parameters.Add("@CustomerID", SqlDbType.VarChar).Value = CustomerID;

        cmd.Parameters.Add("@ContactName", SqlDbType.VarChar).Value = Name;

        cmd.Parameters.Add("@CompanyName", SqlDbType.VarChar).Value = Company;

        GridView1.EditIndex = -1;

        GridView1.DataSource = GetData(cmd);

        GridView1.DataBind();

Complete code for above can be found   from this link  Download link

*change your connection string in web.config file