Start Learning Free
Previous Tutorial
27
DecUnderstanding Grid View in Asp.Net
20 Jun 2024
Beginner
3.56K Views
9 min read
Learn with an interactive course and practical hands-on labs
Free ASP.NET Core Course
GridView control is used to show all table data on the web page. In GridView control each column defines a file or title, and each row depicts a record or data. In short, The GridView control shows data with rows and columns, and you can display the whole table in GridView as well as you can also display only the required columns from a table in GridView control in asp.net./p>
In this ASP.Net tutorial, We will see a brief introduction to GridView Control which will include what is GridView in Asp.Net, what are the features of GridView control, and Creating a GridView in Asp.Net.
Feature of GridView Control
Creating a GridView in Asp.Net
<asp:GridView ID="gridService" runat="server"></asp:GridView> While creating a GridView we will see, how to use a GridView control in ASP.Net using C#.
In this, Let's perform the following different operations on GridView.
- Binding data to the GridView column
- Editing data in GridView
- Updating the GridView
Binding data to the GridView control column
Now First let’s Bind data to the GridView control column
In this ASP.net example of binding data, we will bind data to GridView from the SQL server database. So, we have to make a connection between the given web application and the SQL server database. There are three different methods for making connections, we will see these three connection methods in the given example.
1. Binding data using SQL Connection and SQL DataAdapter
2. Binding Data using DataSet and Table Adapter
3. Binding Data using the LINQ method.
Example:
Design an asp.net web form with GridView control along with three buttons as shown in the below image.
Now add the below namespace on the code page.
using System.Data.SqlClient;
using System.Data; 1. Binding data using SQL Connection and SQL DataAdapter
- In this stage write the given code on the ‘ShowData’ (Display Data)button.
- In this method, we used SQLConnection and SQLDataAdapter objects and wrote SQL queries in code behind the page.
- This SQL connection method shows a unique session to an SQL Server data source.
protected void btnview_Click(object sender, EventArgs e)
{
SqlConnection SQLConn = new SqlConnection("Data Source=.\\SQLEXPRESS;Initial Catalog='Scholarhat';Integrated Security=True");
SqlDataAdapter SQLAdapter = new SqlDataAdapter("Select * from UserTable", SQLConn);
DataTable DT = new DataTable();
SQLAdapter.Fill(DT);
GridView1.DataSource = DT;
GridView1.DataBind();
}
2. Binding Data using DataSet and Table Adapter
- Write the given code on the ‘Show Data using SP’ Button(Display Data using SP).
- In this method, we used DataSet and SQL Stored Procedure for SQL connection.
- Also, we used a Table Adapter instead of DataAdapter.
protected void btnviewdataSP_Click(object sender, EventArgs e)
{
DS_USER.USERMST_SELECTDataTable UDT = new DS_USER.USERMST_SELECTDataTable();
DS_USERTableAdapters.USERMST_SELECTTableAdapter UAdapter = new DS_USERTableAdapters.USERMST_SELECTTableAdapter();
UDT = UAdapter.SelectData();
GridView1.DataSource = UDT;
GridView1.DataBind();
}
Binding Data using LINQ method.
- Here, Write the given code on the ‘Show Data using LINQ’ button(Display Data using LINQ).
- We used the LINQ method to fetch data from the SQL server and Display data in GridView control.
protected void btnviewLINQ_Click(object sender, EventArgs e)
{
DataClassesDataContext Ctx = new DataClassesDataContext();
GridView1.DataSource = Ctx.USERMST_SELECT();
GridView1.DataBind();
}
The result of the above GridView example.
Full code Behind this in C# Compiler
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Data.SqlClient;
using System.Data;
public partial class GridviewExample : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
}
protected void btnview_Click(object sender, EventArgs e)
{
SqlConnection SQLConn = new SqlConnection("Data Source=.\\SQLEXPRESS;Initial Catalog='Scholarhat';Integrated Security=True");
SqlDataAdapter SQLAdapter = new SqlDataAdapter("Select * from UserMST", SQLConn);
DataTable DT = new DataTable();
SQLAdapter.Fill(DT);
GridView1.DataSource = DT;
GridView1.DataBind();
}
protected void btnviewdataSP_Click(object sender, EventArgs e)
{
DS_USER.USERMST_SELECTDataTable UDT = new DS_USER.USERMST_SELECTDataTable();
DS_USERTableAdapters.USERMST_SELECTTableAdapter UAdapter = new DS_USERTableAdapters.USERMST_SELECTTableAdapter();
UDT = UAdapter.SelectData();
GridView1.DataSource = UDT;
GridView1.DataBind();
}
protected void btnviewLINQ_Click(object sender, EventArgs e)
{
DataClassesDataContext Ctx = new DataClassesDataContext();
GridView1.DataSource = Ctx.USERMST_SELECT();
GridView1.DataBind();
}
}
Editing the GridView
protected void gridService_RowEditing(object sender, GridViewEditEventArgs e)
{
try
{
gridService.EditIndex = e.NewEditIndex;
_BindService();
}
catch (Exception)
{
throw;
}
}
Updating the GridView
protected void gridService_RowUpdating(object sender, GridViewUpdateEventArgs e)
{
try
{
string servicename = ((TextBox)gridService.Rows[e.RowIndex].FindControl("txtService")).Text;
string filePath =((FileUpload)gridService.Rows[e.RowIndex].FindControl("fuService")).FileName;
bOService.Service_name = servicename;
bOService.Service_image = "../images/service/" + filePath;
if (File.Exists(Server.MapPath("~/images/service/" + filePath)))
{
}
else
{
((FileUpload)gridService.FooterRow.FindControl("fuService")).SaveAs(Server.MapPath("~/images/service/" + filePath));
}
dALService.UpdateService(bOService);
_BindService();
}
catch (Exception)
{
throw;
}
}
If you want to perform a Delete operation on GridView Please Check the Below article.
New Article: How to Delete Particular Row From Gridview in ASP.Net
Conclusion
From this article, we have learned about GridView Control in Asp.Net, which includes what is GridView in Asp.Net, what is the feature of GridView control, Creating a GridView in Asp.Net, and many more things. However, to simplify development and up your game, learn the intricacies of ASP.NET from ASP.NET Core Training Certification with ScholarHat by Dot Net Tricks and level up as an ASP.Net developer.
FAQs
The GridView is used to display the values of a data source in a table. Each column represents a field, while each row represents a record
It provides a powerful and flexible way to display data in a tabular format.
It allows users to change the width of the grid columns. Indicates whether the data in grid rows should be shown as columns.