ASP.Net DataGrid

ASP.Net DataGrid with asp.net tutorial, asp.net introduction, features, project, example, server controls, labels, textbox, button, hyperlink, radiobutton, calender, checkbox, fileupload, events handling, authentication, webforms model binding, html server control, compare validdator, range validator, validation summary, mvc introduction, mvc project, view, validation, entity framework, authentication etc.

<< Back to ASP

next → ← prev

ASP.NET DataGrid

.NET Framework provides DataGrid control to display data on the web page. It was introduced in .NET 1.0 and now has been deprecated. DataGrid is used to display data in scrollable grid. It requires data source to populate data in the grid.

It is a server side control and can be dragged from the toolbox to the web form. Data Source for the DataGrid can be either a DataTable or a database. Let's see an example, how can we create a DataGrid in our application.

This tutorial contains two examples. One is using the DataTable and second is using the database to display data into the DataGrid.

ASP.NET DataGrid Example with DataTable

This example uses DataTable to bind data to the DataGrid control.

// DataGridExample2.aspx

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="DataGridExample2.aspx.cs" Inherits="DataGridExample.DataGridExample2" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
</head>
<body>
    <form id="form1" runat="server">
        <div>
            <p>This DataGrid contains DataTable records </p>
            <asp:DataGrid ID="DataGrid1" runat="server">
        </asp:DataGrid>
        </div>
    </form>
</body>
</html>

CodeBehind

// DataGridExample2.aspx.cs

using System;
using System.Data;
namespace DataGridExample
{
    public partial class DataGridExample2 : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {
            DataTable table = new DataTable();
            table.Columns.Add("ID");
            table.Columns.Add("Name");
            table.Columns.Add("Email");
            table.Rows.Add("101", "Deepak Kumar", "deepak@example.com");
            table.Rows.Add("102", "John", "john@example.com");
            table.Rows.Add("103", "Subramanium Swami", "subramanium@example.com");
            table.Rows.Add("104", "Abdul Khan", "abdul@example.com");
            DataGrid1.DataSource = table;
            DataGrid1.DataBind();
        }
    }
}

Output:

It produces the following output to the browser.

ASP.NET DataGrid Example with Database

This example uses database as a data source to display data to the DataGrid. This example includes the following steps.

1) Add a web form

Create a new form to drag DataGrid upon it. See, as we did in the following screenshot.

After adding, now, open toolbox and drag DataGrid control to the form.

After dragging, initially it looks like the following.

This form contains the following source code at backend.

// DataGridExample.aspx

<%@ Page Language="C#" AutoEventWireup="true" 
CodeBehind="DataGridExample.aspx.cs" Inherits="AdoNetExample.DataGridExample" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
</head>
<body>
    <form id="form1" runat="server">
        <div>
        </div>
        <asp:DataGrid ID="DataGrid1" runat="server">
        </asp:DataGrid>
    </form>
</body>
</html>

2) Connect to the Database

In the CodeBehind file, we have code of database connectivity, and binding fetched record to the DataGrid.

CodeBehind file

// DataGridExample.aspx.cs

using System;
using System.Data;
using System.Data.SqlClient;
namespace AdoNetExample
{
    public partial class DataGridExample : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {
            using (SqlConnection con = new SqlConnection("data source=.; database=student; integrated security=SSPI"))
            {
                SqlDataAdapter sde = new SqlDataAdapter("Select * from student", con);
                DataSet ds = new DataSet();
                sde.Fill(ds);
                DataGrid1.DataSource = ds;
                DataGrid1.DataBind();
            }
        }
    }
}

Records in SQL Server Table

A student table contains records that we want to display by using the DataGrid. This table contains the following records.

Output:

After executing this application, it fetches records from the SQL server and displays to the web browser.

Next TopicASP.NET Web Form User Registration

← prev next →

.Net

.NET Array Dictionary List String 2D Async DataTable Dates DateTime Enum File For Foreach Format IEnumerable If IndexOf Lambda LINQ Parse Path Process Property Regex Replace Sort Split Static StringBuilder Substring Switch Tuple

Java

Core Array ArrayList HashMap String 2D Cast Character Console Deque Duplicates File For Format HashSet If IndexOf Lambda Math ParseInt Process Random Regex Replace Sort Split StringBuilder Substring Switch Vector While

TheDeveloperBlog.com