Implement default paging in an asp.net gridview that uses objectdatasource - Part 51

Suggested Videos 
Part 48 - Sorting an asp.net gridview in ascending and descending order
Part 49 - How to include sort arrows when sorting an asp.net gridview control
Part 50 - Implement paging in an asp.net gridview that uses sqldatasource



In this video we will discuss about implementing default paging in a gridview control that uses objectdatasource control. 

We will be using tblEmployee table for this demo. Please refer to Part 13 by clicking here, if you need the sql script to create and populate these tables.



Step 1: Drag and drop a gridview, a label  and an objectdatasource control on webform1.aspx

Step 2: Add a class file with name = "EmployeeDataAccessLayer.cs". Copy and paste the following code.
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Data;
using System.Data.SqlClient;
using System.Configuration;

namespace Demo
{
    public class Employee
    {
        public int EmployeeId { get; set; }
        public string Name { get; set; }
        public string Gender { get; set; }
        public string City { get; set; }
    }
    
    public class EmployeeDataAccessLayer
    {
        public static List<Employee> GetAllEmployees()
        {
            List<Employee> listEmployees = new List<Employee>();

            string CS = ConfigurationManager.ConnectionStrings["DBCS"].ConnectionString;
            using (SqlConnection con = new SqlConnection(CS))
            {
                SqlCommand cmd = new SqlCommand("Select * from tblEmployee", con);

                con.Open();
                SqlDataReader rdr = cmd.ExecuteReader();
                while (rdr.Read())
                {
                    Employee employee = new Employee();
                    employee.EmployeeId = Convert.ToInt32(rdr["EmployeeId"]);
                    employee.Name = rdr["Name"].ToString();
                    employee.Gender = rdr["Gender"].ToString();
                    employee.City = rdr["City"].ToString();

                    listEmployees.Add(employee);
                }
            }
            return listEmployees;
        }
    }
}

Step 3: Configure ObjectDataSource1 control to retrieve data from Demo.EmployeeDataAccessLayer business object, using GetAllEmployees() method.

Step 4: Associate GridView1, with ObjectDataSource1 control, and make sure to select "Enable Paging" checkbox.

Step 5: To control the number of rows displayed in the gridview, set PageSize property. Since, I want to display 3 rows on a page, I have set the PageSize to 3.

Step 6: Generate GridView1 control's PreRender eventhandler method. Copy and paste the following code in code-behind file.
protected void GridView1_PreRender(object sender, EventArgs e)
{
    Label1.Text = "Displaying Page " + (GridView1.PageIndex + 1).ToString() 
        + " of " + GridView1.PageCount.ToString();
}

That's it we are done. Run the application. Since we have 6 records in the database table, and as we have set the pagesize to 3, the GridView1 control shows 2 pages with 3 records on each page.

Here is the HTML
<asp:GridView ID="GridView1" runat="server" AllowPaging="True" 
    AutoGenerateColumns="False" DataSourceID="ObjectDataSource1" 
    PageSize="3" onprerender="GridView1_PreRender">
    <Columns>
        <asp:BoundField DataField="EmployeeId" 
            HeaderText="EmployeeId" SortExpression="EmployeeId" />
        <asp:BoundField DataField="Name" HeaderText="Name" 
            SortExpression="Name" />
        <asp:BoundField DataField="Gender" HeaderText="Gender" 
            SortExpression="Gender" />
        <asp:BoundField DataField="City" HeaderText="City" 
            SortExpression="City" />
    </Columns>
</asp:GridView>
<asp:Label ID="Label1" runat="server"></asp:Label>
<asp:ObjectDataSource ID="ObjectDataSource1"  SelectMethod="GetAllEmployees"
    runat="server" TypeName="Demo.EmployeeDataAccessLayer">
</asp:ObjectDataSource>

Points to remember:
1. To control the number of rows displayed per page use PageSize property of GridView control.

2. When paging is enabled AllowPaging attribute of gridview control is set to True
AllowPaging="True"

3. PageIndex property of gridview control can be used to retrieve the page that is currently being viewed. PageIndex is ZERO based, so add 1 to it, to compute the correct page number that is being displayed in the gridview.

4. To get the total number of pages available, use PageCount property of GridView control.

5. With objectdatasource it is possible to implement both default paging and custom paging. With default paging, though we are displaying only 3 records on a page all the rows will be retrieved from the database and the gridview control then displays the correct set of 3 records depending on the page you are viewing. Everytime you click on a page, all the rows will be retrieved. Obviously this is bad for performance. We will discuss about implementing custom paging using objectdatasource control in our next video session, which solves this problem. With custom paging it is possible to retrieve only the required number of rows and not all of them.