Wednesday, March 17, 2010

Editable Grid View

Editable Grid View


Here I will show you how to make use of editable property of Grid View in ASP.NET using C#.

I am new to ASP.NET and my project demanded for editable Grid View. As normal I used Google search engine but it was tough to understand.

Here I am writing how to use Grid view Edit (Update) and delete data from Grid View which is bound with SQL Server.

What you should know:

You should know basic operation of Grid view Control i.e. how to bound grid view with Database.

Let us start…..

Open visual basic and adopt for C# web project, web application (.aspx). Add Grid control to default.aspx page. The initial HTML file look as below.




<html xmlns="http://www.w3.org/1999/xhtml" >


<head runat="server">

<title>Untitled Page</title>

</head>

<body>

<form id="form1" runat="server">

<div>

<asp:GridView ID="GridView1" runat="server">

</asp:GridView>

</div>

</form>

</body>

</html>


















Look for property window and select Grid View. Click on Split view.

In the property window keep AutoGenerateColumns to false and keep AutoGenerateDeleteButton, AutoGenerateEditButton to True. Click on event (which has ligthening mark) in the property window. Double click on RowUpdating, RowEditing, RowDeleting and RowCanceling. In Default .aspx.cs file the function for the row updating, deleting, canceling and deleinting methods will be created as below.

using System;

using System.Collections;

using System.Configuration;

using System.Data;

using System.Linq;

using System.Web;

using System.Web.Security;

using System.Web.UI;

using System.Web.UI.HtmlControls;

using System.Web.UI.WebControls;

using System.Web.UI.WebControls.WebParts;

using System.Xml.Linq;



namespace gridexample

{

public partial class WebForm1 : System.Web.UI.Page

{

protected void Page_Load(object sender, EventArgs e)

{



}



protected void GridView1_RowCancelingEdit(object sender, GridViewCancelEditEventArgs e)

{



}



protected void GridView1_RowDeleting(object sender, GridViewDeleteEventArgs e)

{



}



protected void GridView1_RowEditing(object sender, GridViewEditEventArgs e)

{



}



protected void GridView1_RowUpdating(object sender, GridViewUpdateEventArgs e)

{



}

}

}

Now we can add deletion code in Row Deleting method, Updating code in Row Update method etc…

Sample code for deletion and updating is given below. Here I have taken travel database and CT_Travel table to get data from database and to delete or update the row. Accordingly the HTML pages also changed.

The HTML looks as below:

<asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server">




<table>

<tr>

<td>

<asp:Button ID="ExcelButton" runat="server" Text="Export To Excel"

onclick="ExcelButton_Click" />

</td>

</tr>

<tr>



<asp:GridView ID="DataGridView" runat="server" CellPadding="3" BackColor="#DEBA84"

BorderColor="#DEBA84" BorderStyle="None" BorderWidth="1px" CellSpacing="2"

AutoGenerateColumns="False" AutoGenerateEditButton="True"

onrowcancelingedit="DataGridView_RowCancelingEdit"

onrowediting="DataGridView_RowEditing"

onrowupdating="DataGridView_RowUpdating" AutoGenerateDeleteButton="True"

onrowdeleting="DataGridView_RowDeleting">

<RowStyle BackColor="#FFF7E7" ForeColor="#8C4510" />

<FooterStyle BackColor="#F7DFB5" ForeColor="#8C4510" />

<PagerStyle ForeColor="#8C4510" HorizontalAlign="Center" />

<SelectedRowStyle BackColor="#738A9C" Font-Bold="True" ForeColor="White" />

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

<Columns>

<asp:TemplateField HeaderText="Quater">

<ItemTemplate><%# Eval("Q") %></ItemTemplate>

</asp:TemplateField>

<asp:TemplateField HeaderText="Date">

<ItemTemplate ><%# Eval("Date_Travle") %></ItemTemplate>

</asp:TemplateField>

<asp:TemplateField HeaderText="Days">

<ItemTemplate ><%# Eval("no_of_days") %></ItemTemplate>

</asp:TemplateField>

<asp:TemplateField HeaderText="Site">

<ItemTemplate ><asp:Label ID="siteid" runat="server" Text='<%# Eval("site") %>'></asp:Label></ItemTemplate>

</asp:TemplateField>

<asp:TemplateField HeaderText="State">

<ItemTemplate ><%# Eval("state") %></ItemTemplate>

</asp:TemplateField>

<asp:TemplateField HeaderText="Country">

<ItemTemplate ><%# Eval("country") %></ItemTemplate>

</asp:TemplateField>

<asp:TemplateField HeaderText="Travellar">

<ItemTemplate ><asp:Label ID="travellar" runat="server" Text='<%# Eval("traveller") %>'></asp:Label></ItemTemplate>

</asp:TemplateField>

<asp:TemplateField HeaderText="Manager">

<ItemTemplate ><%# Eval("P_S_Man") %></ItemTemplate>

</asp:TemplateField>

<asp:TemplateField HeaderText="Project/Function">

<ItemTemplate ><%# Eval("P_F") %></ItemTemplate>

</asp:TemplateField>

<asp:TemplateField HeaderText="Purpose">

<ItemTemplate ><%# Eval("purpose") %></ItemTemplate>

</asp:TemplateField>

<asp:TemplateField HeaderText="Category">

<ItemTemplate ><%# Eval("category") %></ItemTemplate>

</asp:TemplateField>

<asp:TemplateField HeaderText="Cost in $">

<ItemTemplate ><%# Eval("Aprox_Cost") %></ItemTemplate>

</asp:TemplateField>

<asp:TemplateField HeaderText="PGM">

<ItemTemplate ><%# Eval("PGM") %></ItemTemplate>

</asp:TemplateField>

<asp:TemplateField HeaderText="Status">

<ItemTemplate ><%# Eval("Status") %></ItemTemplate>

<EditItemTemplate>

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

</EditItemTemplate>

</asp:TemplateField>

<asp:TemplateField HeaderText="GM_Appr">

<ItemTemplate ><%# Eval("GM_Appr") %></ItemTemplate>

<EditItemTemplate>

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

</EditItemTemplate>

</asp:TemplateField>



</Columns>

</asp:GridView>

</tr>

</table>

</asp:Content>














The code page (default.aspx.cs) looks as:



namespace Travel

{

public partial class DataSheet : System.Web.UI.Page

{

string dept_name;

DataSet ds = new DataSet();

DataView dv = new DataView();

protected void Page_Load(object sender, EventArgs e)

{

dept_name = Request.QueryString["Dept"].ToString();

if (!IsPostBack)

{

bind();

}

}



public void bind()

{

if (dept_name == "All Team")

{

DataGridView.DataSource = getDatagridAll();

Page.DataBind();

}

else

{

DataGridView.DataSource = getDatagrid(dept_name);

Page.DataBind();

}

}



public DataView getDatagrid(string s_name)

{



ds = Travel.Connection.connection.getDataSheet(s_name);

dv = ds.Tables[0].DefaultView;

return dv;

}



public DataView getDatagridAll()

{



ds = Travel.Connection.connection.getDataSheetAll();

dv = ds.Tables[0].DefaultView;

return dv;

}



protected void ExcelButton_Click(object sender, EventArgs e)

{

Response.Clear();

Response.AddHeader("content-disposition", "attachment;filename=Travel status_" + dept_name + ".xls");

Response.Charset = "";



// If you want the option to open the Excel file without saving than

// comment out the line below

// Response.Cache.SetCacheability(HttpCacheability.NoCache);



Response.ContentType = "application/vnd.xls";

System.IO.StringWriter stringWrite = new System.IO.StringWriter();



System.Web.UI.HtmlTextWriter htmlWrite = new HtmlTextWriter(stringWrite);



DataGridView.RenderControl(htmlWrite);

Response.Write(stringWrite.ToString());

Response.End();

}

public override void VerifyRenderingInServerForm(Control control)

{



// Confirms that an HtmlForm control is rendered for the

//specified ASP.NET server control at run time.



}



protected void DataGridView_RowEditing(object sender, GridViewEditEventArgs e)

{

DataGridView.EditIndex = e.NewEditIndex;

bind();

}



protected void DataGridView_RowUpdating(object sender, GridViewUpdateEventArgs e)

{

GridViewRow row = (GridViewRow)DataGridView.Rows[e.RowIndex];

Label siteid = (Label)row.FindControl("siteid");

Label travellar = (Label)row.FindControl("travellar");

TextBox Ststus = (TextBox)row.FindControl("Status");

TextBox GM_Appr = (TextBox)row.FindControl("GM_Appr");

DataGridView.EditIndex = -1;

SqlConnection DataConn = new SqlConnection("user id=travel;" + "pwd=travel;" + "Server=servername;" + "Trusted_Connection=yes;" + "database=travel;" + "connection timeout=30");

DataConn.Open();

SqlCommand DataCmd = new SqlCommand("update dbo.CT_Travel set Status = '" + Ststus.Text + "', GM_Appr = '" + GM_Appr.Text + "' where site = '" + siteid.Text + "' and traveller = '" + travellar.Text + "'", DataConn);

DataCmd.ExecuteNonQuery();

DataConn.Close();

bind();

}



protected void DataGridView_RowCancelingEdit(object sender, GridViewCancelEditEventArgs e)

{

DataGridView.EditIndex = -1;

bind();

}



protected void DataGridView_RowDeleting(object sender, GridViewDeleteEventArgs e)

{

GridViewRow row = (GridViewRow)DataGridView.Rows[e.RowIndex];

Label siteid = (Label)row.FindControl("siteid");

Label travellar = (Label)row.FindControl("travellar");

SqlConnection DataConn = new SqlConnection("user id=travel;" + "pwd=travel;" + "Server=servername;" + "Trusted_Connection=yes;" + "database=travel;" + "connection timeout=30");

DataConn.Open();

SqlCommand DataCmd = new SqlCommand("delete from dbo.CT_Travel where site = '" + siteid.Text + "' and traveller = '" + travellar.Text + "'", DataConn);

DataCmd.ExecuteNonQuery();

DataConn.Close();

bind();

}



}

}

No comments:

Post a Comment

site hit counter