Edit, Update, Delete in Gridview using 3- tier in ASP.Net with C#.

In previous asp.net post we discussed how to create 3 – tier architecture application asp.net using c#.
we already discussed about 3 – tier architecture layers Presentation Layer, Business Logic Layer and Data Access Layer.

Now, In this asp.net article i will explain you how to bind data to gridview and edit, update, delete data in gridview in asp.net using 3 – tier architecture.

STEP 1 : Create ASP.Net web application

First open the visual studio and create a new asp.net web application.
open visual studio –> File menu –>New –>Website

Select ASP.Net web site and declare name “ThreeExample” as website name.

Create ASP.Net three tier architecture web application.
Create ASP.Net three tier architecture web application.

Here, we have created asp.net web application.

STEP 2 : Design the default.aspx page for user Registration.

Now, design the default.aspx page as shows like below for simple user registration form.

<%@ Page Language="C#" AutoEventWireup="true"

&nbsp;

CodeFile="Default.aspx.cs" Inherits="_Default" %>

&nbsp;

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

&nbsp;

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

&nbsp;

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

<head runat="server">

<title>Three Tier Architecture in ASP.Net</title>

&nbsp;

</head>

<body>

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

<div>

&nbsp;

<table>

<tr>

<td colspan="2">

3-tier User Registration Form</td>

</tr>

<tr>

<td>

Name :</td>

<td>

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

</td>

</tr>

<tr>

<td>

Address :

</td>

<td>

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

</td>

</tr>

<tr>

<td>

City :

</td>

<td>

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

</td>

</tr>

<tr>

<td>

Email :

</td>

<td>

<asp:TextBox ID="txtemail" runat="server" style="height:

&nbsp;

22px"></asp:TextBox>

</td>

</tr>

<tr>

<td>

&amp;nbsp;</td>

<td>

<asp:Button ID="Button1" runat="server" Text="SAVE" />

</td>

</tr>

<tr><td></td>

<td><asp:GridView ID="GridView1" runat="server" CellPadding="4" ForeColor="#333333"

GridLines="None" Width="330px" AutoGenerateDeleteButton="True"

AutoGenerateEditButton="True" DataKeyNames="ID"

onrowcancelingedit="GridView1_RowCancelingEdit"

onrowdeleting="GridView1_RowDeleting" onrowediting="GridView1_RowEditing"

onrowupdating="GridView1_RowUpdating">

<RowStyle BackColor="#E3EAEB" />

<FooterStyle BackColor="#1C5E55" Font-Bold="True" ForeColor="White" />

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

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

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

<EditRowStyle BackColor="#7C6F57" />

<AlternatingRowStyle BackColor="White" />

</asp:GridView></td></tr>

</table>

&nbsp;

</div>

</form>

</body>

</html>

Above is the html code for design web forms.
Our asp.net web for design look like below:

3- tier architecture in asp.net
Edit, Update, Delete in Gridview in asp.net using 3 – tier architecture.

Now, set gridview property AutoGenerateDeleteButton=True and AutoGenerateEditButton=True.

3- tier architecture in asp.net
Edit, Update, Delete in Gridview in asp.net using 3 – tier architecture.

SPET 3 : Create New Database in SQL Server

Now, create new database in sql server named “ThreeExp”, and create a new table “UserMst” in newly created sql database.

Create New Table in sql server
Create New Table in sql server

In above screen we can see, there are five column in UserMst Table in sql. The first column is ID which is identification of user, so it must be unique. Here we set ID column Primary Key and AutoIncrement by updating the ID column property.

After creating new table create new stored procedure for Insert records, Select records, Update and Delete records.

Stored Procedure for SELECT

set ANSI_NULLS ON
set QUOTED_IDENTIFIER ON
GO
ALTER PROCEDURE [dbo].[USERMST_SELECT]
AS
BEGIN

SELECT * FROM USERMST

END

stored Procedure for INSERT

set ANSI_NULLS ON 
set QUOTED_IDENTIFIER ON 
GO 
CREATE PROCEDURE [dbo].[USERMST_INSERT] 
@NAME AS NVARCHAR(256), 
@ADD AS NVARCHAR(256), 
@CITY AS NVARCHAR(256), 
@EMAIL AS NVARCHAR(256) 
AS 
BEGIN 
INSERT INTO USERMST VALUES (@NAME,@ADD,@CITY,@EMAIL) 
END

FOR UPDATE :

set ANSI_NULLS ON
set QUOTED_IDENTIFIER ON
GO

ALTER PROCEDURE [dbo].[USERMST_UPDATE]

@ID AS INT,
@NAME AS NVARCHAR(256),
@ADD AS NVARCHAR(256),
@CITY AS NVARCHAR(256),
@EMAIL AS NVARCHAR(256)
AS
BEGIN

UPDATE&nbsp; USERMST SET NAME=@NAME,ADDRESS=@ADD,CITY=@CITY,EMAIL=@EMAIL WHERE ID=@ID

END

FOR DELETE :

set ANSI_NULLS ON
set QUOTED_IDENTIFIER ON
GO

ALTER PROCEDURE [dbo].[USERMST_DELETE]

@ID AS INT
AS
BEGIN

DELETE FROM USERMST WHERE ID=@ID

END

 

STEP 4 :  Create new class Library for Data Access Layer. right click on solution — >> ADD — >> New Project –>> Class Library

Add New Class Library for 3 tier asp.net web application.
Add New Class Library for 3 tier asp.net web application.

select Class Library option as show below figure and named “DataLayer” for new class library project.

Add New Class Library for 3 tier asp.net web application.
Add New Class Library for 3 tier asp.net web application.

Now, we all know as write sql connection code in data access layer. There are many methods developer uses for sql connectivity. we here explain two methods for sql connectivity. first using DataSet and second using Data Adapter. STEP 5 : Connection with DataSet using Different connection method let’s try with first method using DataSet. Create new DataSet in Data Layer Class Library project and bind select and insert stored procedure in DataSet. DataLayer –> Add –> New Item –> DataSet

ADD New DataSet in Data Layer for sql database connectivity
ADD New DataSet in Data Layer for sql database connectivity

set the new dataset name as “DS_User”.

ADD New DataSet in Data Layer for sql database connectivity
ADD New DataSet in Data Layer for sql database connectivity

after creating new dataset follow some step to make sql connectivity like below. Create new Table Adapter in DataSet and bind select and inset stored procedure.

Make connection between asp.net and sql using DataSet
Make connection between asp.net and sql using DataSet

Finish above dataset wizard with bind select, insert, update and delete stored procedure with it. After binding all stored procedure we have connection string in web.config file. STEP 6 : write code in Data Access Layer

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Configuration;
using System.Data; using System.Data.SqlClient;
namespace DataLayer
{
public class ClsDataLayer
{
DS_User.USERMST_SELECTDataTable UDT = new DS_User.USERMST_SELECTDataTable();
DS_UserTableAdapters.USERMST_SELECTTableAdapter UAdaspter = new DataLayer.DS_UserTableAdapters.USERMST_SELECTTableAdapter();

//for insert record to database public void InsertData(string _name, string _add, string _city, string _email)
{
UAdaspter.Insert(_name, _add, _city, _email);
}

//for select record from database
public object SelectData()
{
return UDT = UAdaspter.SelectUser();
}

//update recods
public void EditData(int _id, string _name, string _add, string _city, string _email)
{
UAdaspter.Update(_id, _name, _add, _city, _email);
}

//delete record
public void DeleteData(int _id)
{
UAdaspter.Delete(_id);
}
}
}

 

In above we have used DataSet method for sql connectivity.

Now, let’s create Business logic layer for use all data access method of user select, insert, update and delete.

STEP 7 : Create Business Logic Layer (BLL)

Repeat same process as we created Data Access layer. Here creating new class library project named “BusineesLayer”.

Create New Class Library project  Business Logic Layer in asp.net
Create New Class Library project Business Logic Layer in asp.net

Now, we have see the three tier architecture in our application clearly.

Three tier architecture example in asp.net c#
Three tier architecture example in asp.net c#

Now, after creating business layer class library import namespace of database layer by adding references manually as show below:

BusinessLayer –> References –> Add References –> Project –> DataLayer

Add data access class references to business layer.
Add data access class references to business layer.

 

Add data access class references to business layer.
Add data access class references to business layer.

After importing references create data layer class object in business logic layer class.

write code in business layer for communicate data layer and presentation layer.

first import namespace
using DataLayer;

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using DataLayer;

namespace BusinessLayer
{
public class ClsBusLayer
{
public ClsDataLayer objDAL = new ClsDataLayer();

public void InsertNewUser(string _name, string _add, string _city, string _email)
{
objDAL.InsertData(_name, _add, _city, _email);
}

public object SelectUser()
{
return objDAL.SelectData();
}

public void EditUser(int _id, string _name, string _add, string _city, string _email)
{
objDAL.EditData(_id, _name, _add, _city, _email);
}
public void DeleteUser(int _id)
{
objDAL.DeleteData(_id);
}
}
}

 


STEP 8 :  Presentation Layer

Now, in our three tier web application import add references of business layer into web application references folder.

web application –> Add References –> Project –> Business layer

Add references of business layer into web application references folder.
Add references of business layer into web application references folder.
Add references of business layer into web application references folder.
Add references of business layer into web application references folder.
Add references of business layer into web application references folder.
Add references of business layer into web application references folder.

Now, come back on asp.net web form to write code for  insert, select, Edit, and delete user records.

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using BusinessLayer;
public partial class _Default : System.Web.UI.Page
{
ClsBusLayer ObjBLL = new ClsBusLayer();
protected void Page_Load(object sender, EventArgs e)
{
if (Page.IsPostBack == false)
{
//for select record and bind to gridview
GridView1.DataSource = ObjBLL.SelectUser();
GridView1.DataBind();
}
}
protected void btnsave_Click(object sender, EventArgs e)
{
//for insert record
ObjBLL.InsertNewUser(txtname.Text, txtaddress.Text, txtcity.Text, txtemail.Text);

//for select record and bind to gridview
GridView1.DataSource = ObjBLL.SelectUser();
GridView1.DataBind();

}

protected void GridView1_RowUpdating(object sender, GridViewUpdateEventArgs e)
{
int idd =Convert.ToInt32(GridView1.DataKeys[e.RowIndex].Value);
TextBox txtnamee = (TextBox)GridView1.Rows[e.RowIndex].Cells[2].Controls[0];
TextBox txtaddd = (TextBox)GridView1.Rows[e.RowIndex].Cells[3].Controls[0];
TextBox txtcityy = (TextBox)GridView1.Rows[e.RowIndex].Cells[4].Controls[0];
TextBox txtemaill = (TextBox)GridView1.Rows[e.RowIndex].Cells[5].Controls[0];

ObjBLL.EditUser(idd, txtnamee.Text, txtaddd.Text, txtcityy.Text, txtemaill.Text);

GridView1.EditIndex = -1;
GridView1.DataSource = ObjBLL.SelectUser();
GridView1.DataBind();
}
protected void GridView1_RowEditing(object sender, GridViewEditEventArgs e)
{
GridView1.EditIndex = e.NewEditIndex;
GridView1.DataSource = ObjBLL.SelectUser();
GridView1.DataBind();
}
protected void GridView1_RowDeleting(object sender, GridViewDeleteEventArgs e)
{
int idd =Convert.ToInt32(GridView1.DataKeys[e.RowIndex].Value);
ObjBLL.DeleteUser(idd);
GridView1.DataSource = ObjBLL.SelectUser();
GridView1.DataBind();
}
protected void GridView1_RowCancelingEdit(object sender, GridViewCancelEditEventArgs e)
{

GridView1.EditIndex = -1;
GridView1.DataSource = ObjBLL.SelectUser();
GridView1.DataBind();
}
}

 

Here is the result of asp.net 3 – tier edit, update, delete gridview example.
Below screen show that we have successfully added three records in database and  bind it to with gridview.

3- tier architecture in asp.net
Edit, Update, Delete in Gridview in asp.net using 3 – tier architecture.

– When we click Edit button we have screen like below with Update and Cancel Button, and all the value of that row are in textbox so we can modify and click update button to update record in database.

3- tier architecture in asp.net
Edit, Update, Delete in Gridview in asp.net using 3 – tier architecture.

 

3- tier architecture in asp.net
Edit, Update, Delete in Gridview in asp.net using 3 – tier architecture.

Below screen shows,  we have delete third record from database so only rest of two records display in below gridview.

3- tier architecture in asp.net
Edit, Update, Delete in Gridview in asp.net using 3 – tier architecture.

I hope this edit, update, delete in gridview using 3 – tier architecture in asp.net will help you…..

Author: Meera Academy

Leave a Reply

Your email address will not be published. Required fields are marked *