Edit, Delete and Update in a DataGrid in Visual Web developer 2005

If you are going to use DataGrid then here we need to edit, update, delete data in DataGrid. Suppose in that table which data you are using in DataGrid, there are so many records that on one page all of the records can not come, then here paging plays an important role to show our data in a manner in DataGrid.

So in this article I am going to show how to edit, delete and update data in DataGrid and paging too.

This is the aspx code:

From Here we can design our web form. We use a DataGrid on webForm. Here we set all the property as we have to perform the operation with in DataGrid.

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

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<title>Edit Update Cancel In DataGrid</title>

</head>

<body>

<div>

<asp:DataGrid ID="gridedit" runat="server" DataKeyField="id" BorderStyle="Ridge" GridLines="None" BorderWidth="2px" BorderColor="White" BackColor="White" CellPadding= "3" CellSpacing="1" AllowSorting="True" PagerStyle- HorizontalAlign= "Center" HorizontalAlign="Left" OnEditCommand="editgrid_click" OnCancelCommand= "gridcancel_click" OnPageIndexChanged="gridedit_PageIndexChanged" OnUpdateCommand="updategrid_UpdateCommand" Height="267px" PageSize=5 AllowPaging="true" OnDeleteCommand= "gridedit_DeleteCommand" AutoGenerateColumns="false" Width="50%">

<HeaderStyle Font-Bold="True" ForeColor="#FFFFFF"

BackColor="#A53A6A"></HeaderStyle>

<asp:BoundColumn DataField=id HeaderText="ID">

</asp:BoundColumn>

<asp:BoundColumn DataField=name HeaderText="Name">

</asp:BoundColumn>

<asp:BoundColumn DataField=F_name HeaderText="F_Name">

</asp:BoundColumn>

<asp:BoundColumn DataField=l_name HeaderText="L_Name">

</asp:BoundColumn>

<asp:BoundColumn DataField=City HeaderText="City">

</asp:BoundColumn>

<asp:BoundColumn DataField=State HeaderText="State">

</asp:BoundColumn>

<asp:EditCommandColumn CancelText="Cancel" EditText="Edit"

UpdateText="Update" HeaderText="Edit">

</asp:EditCommandColumn>

<asp:ButtonColumn CommandName="Delete" HeaderText="Delete" Text="Delete">

</asp:ButtonColumn>

</Columns>

</asp:DataGrid>

</div>

</form>

</body>

</html>

With this aspx code our web form will become look like as:

Figure 1.

This is the source code:

using System;

using System.Data;

using System.Configuration;

using System.Web;

using System.Web.Security;

using System.Web.UI;

using System.Web.UI.WebControls;

using System.Web.UI.WebControls.WebParts;

using System.Web.UI.HtmlControls;

using System.Data.SqlClient;

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

{

SqlDataAdapter da;

DataSet ds = new DataSet();

SqlConnection con;

SqlCommand cmd = new SqlCommand();

protected void Page_Load(object sender, EventArgs e)

{

if (!Page.IsPostBack)

{

Binddata();

}

// Define the Edit Command

public void editgrid_click(object sender, DataGridCommandEventArgs e)

{

gridedit.EditItemIndex = e.Item.ItemIndex;

Binddata();

}

// Define the Cancel Command

public void gridcancel_click(object sender, DataGridCommandEventArgs e)

{

gridedit.EditItemIndex = -1;

Binddata();

}

//Here we Bind the data

public void Binddata()

{

con = new SqlConnection(ConfigurationSettings.AppSettings["connect"]);

cmd.CommandText = "select * from record";

cmd.Connection = con;

da = new SqlDataAdapter(cmd);

da.Fill(ds);

con.Open();

cmd.ExecuteNonQuery();

gridedit.DataSource = ds;

gridedit.DataBind();

con.Close();

}

//Update Command Defination

protected void updategrid_UpdateCommand(object source, DataGridCommandEventArgs e)

{

con = new SqlConnection(ConfigurationSettings.AppSettings["connect"]);

cmd.CommandText = "Update record set name=@name ,F_name=@F_Name,

l_name=@l_name,City=@City,State=@State where id=@id";

cmd.Parameters.Add("@name", SqlDbType.Char).Value = ((TextBox)e.Item.Cells[1].Controls[0]).Text;

cmd.Parameters.Add("@F_name", SqlDbType.Char).Value = ((TextBox)e.Item.Cells[2].Controls[0]).Text;

cmd.Parameters.Add("@l_name", SqlDbType.Char).Value = ((TextBox)e.Item.Cells[3].Controls[0]).Text;

cmd.Parameters.Add("@City", SqlDbType.Char).Value = ((TextBox)e.Item.Cells[4].Controls[0]).Text;

cmd.Parameters.Add("@State", SqlDbType.Char).Value = ((TextBox)e.Item.Cells[5].Controls[0]).Text;

cmd.Parameters.Add("@id", SqlDbType.Int).Value = gridedit.DataKeys[e.Item.ItemIndex];

cmd.Connection = con;

cmd.Connection.Open();

cmd.ExecuteNonQuery();

cmd.Connection.Close();

gridedit.EditItemIndex = -1;

Binddata();

}

// Delete Command Defination

public void gridedit_DeleteCommand(object sender, DataGridCommandEventArgs e)

{

con = new SqlConnection(ConfigurationSettings.AppSettings["connect"]);

int U_ID = (int)gridedit.DataKeys[(int)e.Item.ItemIndex];

cmd.CommandText = " Delete from record where id=" + U_ID;

cmd.Connection = con;

cmd.Connection.Open();

cmd.ExecuteNonQuery();

cmd.Connection.Close();

gridedit.EditItemIndex = -1;

Binddata();

}

// For Paging

public void gridedit_PageIndexChanged(object source, DataGridPageChangedEventArgs e)

{

gridedit.CurrentPageIndex = e.NewPageIndex;

Binddata();

}

When we run our project then it will look as:

Figure 2.

If I click on Edit then it will look like as :

Figure 3.