---
title: "Editable GridView in Asp.Net"
description: "In this blog, I’m explaining how to make a gridview editable in asp.net Step 1: First create an asp.net empty web application and add"
author: "Sumit Kesarwani"
published: 2013-12-29
updated: 2014-09-18
canonical: https://www.mindstick.com/blog/621/editable-gridview-in-asp-dot-net
category: "asp.net"
tags: ["asp.net"]
reading_time: 3 minutes
---
# Editable GridView in Asp.Net
In this blog, I’m explaining how to make a [gridview](https://www.mindstick.com/articles/873/update-delete-edit-gridview-in-asp-dot-net) editable in [asp.net](https://www.mindstick.com/articles/934/default-folders-available-inside-the-asp-dot-net-application-folder) Step 1:
First create an asp.net empty [web application](https://www.mindstick.com/articles/13069/progressive-web-application-pwas-all-you-need-to-know-about) and add a web form to the solution.
##### Step 2:
Now add a gridview by [drag and drop](https://www.mindstick.com/forum/454/how-to-drag-and-drop-multiple-image-from-one-canvas-to-onther-canvas-in-html5) from the toolbox and true these [properties](https://www.mindstick.com/articles/23331/nootropics-7-different-types-and-their-unique-properties):
· AutoGenerateDeleteButton
· AutoGenerateEditButton
\
As you make true to these properties, your gridview will look like this:
\
```
```
##### Step 3:
Now add the below code in the .aspx.cs file:
```
protected void Page_Load(object sender, EventArgs e) { if (!IsPostBack) { bindData(); } }public void bindData(){ SqlConnection conn = new SqlConnection(WebConfigurationManager.ConnectionStrings["Connect"].ToString()); conn.Open(); SqlCommand cmd = new SqlCommand(); cmd.CommandText = "select * from Employee"; cmd.Connection = conn; cmd.ExecuteNonQuery(); SqlDataAdapter adap = new SqlDataAdapter(cmd); DataTable dt = new DataTable(); adap.Fill(dt); gridViewEmployee.DataSource = dt; gridViewEmployee.DataBind();}
```
When you run the above code, this will display all values from [Employee](https://www.mindstick.com/articles/85431/remote-employee-training-tips-tricks) table.
##### Step 4:
To make the gridview editable – add the following [events](https://www.mindstick.com/blog/102/events-in-c-sharp) to the gridview:
· RowEditing
· RowUpdating
· RowDeleting
· RowCancelingEdit
\
When you add the above events to the gridview , the code in aspx file will look like this:
```
AlternatingRowStyle BackColor="#FF33CC" BorderColor="#FFFF99" BorderStyle="Solid"BorderWidth="3px" />
```
##### Step 5:
Now add the code to the events:
##### RowEditing
```
protected void gridViewEmployee_RowEditing(object sender, GridViewEditEventArgs e) { gridViewEmployee.EditIndex = e.NewEditIndex; bindData(); }
```
##### RowDeleting
```
protected void gridViewEmployee_RowDeleting(object sender, GridViewDeleteEventArgs e) { string id = gridViewEmployee.Rows[e.RowIndex].Cells[1].Text; SqlConnection conn = new SqlConnection(WebConfigurationManager.ConnectionStrings["Connect"].ToString()); conn.Open(); SqlCommand cmd = new SqlCommand(); cmd.CommandText = "delete from Employee where id="+id+""; cmd.Connection = conn; cmd.ExecuteNonQuery(); bindData(); }
```
##### RowUpdating
```
protected void gridViewEmployee_RowUpdating(object sender, GridViewUpdateEventArgs e) { string id = ((TextBox)gridViewEmployee.Rows[e.RowIndex].Cells[1].Controls[0]).Text; string name = ((TextBox)gridViewEmployee.Rows[e.RowIndex].Cells[2].Controls[0]).Text; string designation = ((TextBox)gridViewEmployee.Rows[e.RowIndex].Cells[3].Controls[0]).Text; string salary = ((TextBox)gridViewEmployee.Rows[e.RowIndex].Cells[4].Controls[0]).Text; string telephone = ((TextBox)gridViewEmployee.Rows[e.RowIndex].Cells[5].Controls[0]).Text; SqlConnection conn = new SqlConnection(WebConfigurationManager.ConnectionStrings["Connect"].ToString()); conn.Open(); SqlCommand cmd = new SqlCommand(); cmd.CommandText = "Update Employee set name='"+name+"',designation='"+designation+"',salary='"+salary+"',telephone='"+telephone+"' where id="+id+""; cmd.Connection = conn; cmd.ExecuteNonQuery(); gridViewEmployee.EditIndex = -1; bindData(); }
```
##### RowCancelingEdit
```
protected void gridViewEmployee_RowCancelingEdit(object sender, GridViewCancelEditEventArgs e) { gridViewEmployee.EditIndex = -1; bindData(); }
```
Adding the above codes to the appropriate events will make the gridview editable and allow you to edit, update and delete the records from gridview.
##### Output
When you run the project, it will show you all the values from the database.
When you click the edit [button](https://www.mindstick.com/articles/63/how-to-add-button-in-datagridview-in-csharp-dot-net):
Update the values according to your need or you can cancel it:
I have updated the salary of “Mark David” from 180000 to 100000:
When you click the delete button:
I have [deleted](https://www.mindstick.com/forum/145533/restore-the-accidentally-deleted-bookmarks-on-chrome) the “Mark David” record.
---
Original Source: https://www.mindstick.com/blog/621/editable-gridview-in-asp-dot-net
Copyright © MindStick Software Pvt. Ltd. This Markdown version is provided for developers, AI systems, and offline reading.