ViewState with example in asp.net C#

Monday, February 21, 2011

Fully Editable GridView in ASP.NET 2 using C#

This post demonstrate  how to make a GridView editable all the time using C# asp.net.

step1-: Create a table with name " items" with following columns("iterm_no","name","price")
            where "iterm_no" is identity column.as describe below

            create table items
            (
               iterm_no int identity(1,1),
              name varchar(20),
              price numeric(10,2)
           )
step2- Now create a web page with name(EditableGridView). as describe below.

            <%@ Page Language="C#" AutoEventWireup="true" CodeFile="EditableGridView.aspx.cs" Inherits="EditableGridView" %>

<!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>Editable GridView</title>
</head>
<body>
    <form id="form1" runat="server">
    <div>
  
    <asp:GridView ID="GridView1" runat="server" AllowPaging="True" AutoGenerateColumns="False"
BackColor="White" BorderColor="#CCCCCC" BorderStyle="None" BorderWidth="1px"
CellPadding="3" DataKeyNames="INTERM_NO" >
<FooterStyle BackColor="White" ForeColor="#000066" />
<Columns>
<asp:BoundField DataField="INTERM_NO" HeaderText="ITEM_N0" InsertVisible="False" ReadOnly="True"
SortExpression="INTERM_NO" />
<asp:TemplateField HeaderText="NAME" SortExpression="NAME">
<ItemTemplate>
<asp:TextBox ID="TextBox1" runat="server" Text='<%# Bind("NAME") %>'
OnTextChanged="TextBox_TextChanged" BorderStyle="None"></asp:TextBox>
<asp:HiddenField ID="HiddenField1" runat="server" Value='<%# Eval("INTERM_NO") %>' />
</ItemTemplate>
</asp:TemplateField>


<asp:TemplateField HeaderText="PRICE" SortExpression="PRICE">
<ItemTemplate>
<asp:TextBox ID="TextBox2" runat="server" Text='<%# Bind("PRICE") %>'
OnTextChanged="TextBox_TextChanged" BorderStyle="None"></asp:TextBox>
</ItemTemplate>
</asp:TemplateField>



</Columns>
<RowStyle ForeColor="#000066" />
<SelectedRowStyle BackColor="#669999" Font-Bold="True" ForeColor="White" />
<PagerStyle BackColor="White" ForeColor="#000066" HorizontalAlign="Left" />
<HeaderStyle BackColor="#006699" Font-Bold="True" ForeColor="White" />
</asp:GridView>
    </div>
    <asp:Button ID="btnUpdate" runat="server" onclick="btnUpdate_Click"
        Text="Update" />
    <asp:Label ID="lblMessage" runat="server"></asp:Label>
    </form>
</body>
</html>

step 3- Go to your code behind (EditableGridView.cs) as describe below.
using System;
using System.Configuration;
using System.Data;
using System.Web;
using System.Web.UI;
using System.Web.UI.HtmlControls;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Data.SqlClient;

public partial class EditableGridView : System.Web.UI.Page
{
 
    SqlConnection con;
    bool[] rowChanged;
    protected void Page_Load(object sender, EventArgs e)
    {
        string conString = ConfigurationSettings.AppSettings["mycon"];
        con = new SqlConnection(conString);
        int totalRows = GridView1.Rows.Count;
        rowChanged = new bool[totalRows];
        if (!Page.IsPostBack)
        {
            BindGrid();
        }
    }

    public void BindGrid()
    {
        SqlDataAdapter adap = new SqlDataAdapter("select * from items", con);
        DataTable dt = new DataTable();
        adap.Fill(dt);
        GridView1.DataSource = dt;
        GridView1.DataBind();
    }

    protected void TextBox_TextChanged(object sender, EventArgs e)
    {
        TextBox thisTextBox = (TextBox)sender;
        GridViewRow thisGridViewRow = (GridViewRow)thisTextBox.Parent.Parent;
        int row = thisGridViewRow.RowIndex;
        rowChanged[row] = true;
    }



    protected void btnUpdate_Click(object sender, EventArgs e)
    {
        if (Page.IsPostBack)
        {
            int totalRows = GridView1.Rows.Count;
            for (int r = 0; r < totalRows; r++)
            {
                if (rowChanged[r])
                {
                    GridViewRow thisGridViewRow = GridView1.Rows[r];
                    HiddenField hf1 = (HiddenField)thisGridViewRow.FindControl("HiddenField1");
                    string pk = hf1.Value;
                    TextBox tb1 = (TextBox)thisGridViewRow.FindControl("TextBox1");
                    string name = tb1.Text;
                    TextBox tb2 = (TextBox)thisGridViewRow.FindControl("TextBox2");
                    decimal price = Convert.ToDecimal(tb2.Text);

                    SqlCommand cmd = new SqlCommand("update items set name='" + name + "' , price='" + price + "' where INTERM_NO=' " + pk + "'", con);
                    if (con.State == ConnectionState.Closed)
                    {
                        con.Open();
                    }
                    int temp = cmd.ExecuteNonQuery();
                    if (temp > 0)
                    {
                        lblMessage.Text = "Operation perform successfully";
                        con.Close();
                    }


                }
            }
            GridView1.DataBind();
            BindGrid();
        }
    }
}
Note: If you have any query or question about this post contact us:
Posted by at
Labels:

7 comments:

  1. .net Code ProtectionMarch 4, 2011 at 6:48 PM

    Nice coding its really working great fro me as i was trying to create one and was facing quite a problem in doing so.

    ReplyDelete
  2. Shivam GuptaMarch 5, 2011 at 12:08 PM

    nice !!

    ReplyDelete
  3. anand sutarAugust 8, 2012 at 12:37 PM

    thanks sir .....its really working its a good concept

    ReplyDelete
  4. AnonymousAugust 24, 2012 at 10:10 PM

    Hi,I'm from sri lanka,i saw this post today.thisone really helpful to me.. thanks

    ReplyDelete
  5. AnonymousNovember 6, 2012 at 9:04 PM

    Hello, I am new to the GridView control and C#.. but do program in VbScript/ASP and javascript. I am having an issue getting this to work. Can you help me please? Are you sure the pages are named correctly in you code?
    "EditableGridView" and "EditableGridView.cs"?
    Isn't one page supposed to be "EditableGridView.aspx"?
    And why is the code at the top of EditableGridView reference the the pages with different names -
    CodeFile="EditableGridView.aspx.cs" Inherits="EditableGridView.cs " %>

    ReplyDelete

Subscribe to: Post Comments (Atom)