ARTICLE

Custom Paging in Gridview

Posted by Sandeep Singh Shekhawat Articles | C# Language December 02, 2012
In this article I am explaining custom paging in a grid view. Gridview has builtin paging but custom paging improves performance.
Reader Level:

Stored ProcedureSuppose we have 2000 records in a table and we want to display only 10 records in a page; then why fetch 2000-10 = 1990 extra records. These extra records take too much bandwidth and reduce performance.

So here is how to solve the problem step-by-step

Step 1: Create a Stored Procedure for paging, as in:

Store-procedure-for-paging.gif

In the above Stored Procedure we are passing three parameters, two input parameters and one output parameter. The input parameters @PageIndex and @PageSize are to fetch records. These parameters represent the page number and how may records to display on that page. The output parameter @TotalRow is to display how many total records are in the table.

Step 2: Use a GridView

Now I use a grid view that shows employee data.

gridview.gif

Step 3: Use a Repeater

A Repeater Control is used as a pager (to change pages). It uses a linkbutton that shows the page number in the bottom of the grid view.

Repeater.gif

Step 4: Fill Employee Data in GridView

I create a method that gets all employee specific page data and the total number of records in the table. Here I define the pagesize as 5, in other words each page will display only 5 records. TotalRow is used to determine how many rows there are in the table so we can create paging according.

Fill-Data-in-GridView.gif

Step 5: Create pager

Here I create the page number depending on the total number of records in the table. Here we are also adding two extra link buttons; these are "First" and "Next". These page numbers are bound with the repeater control.

Fill-Data-in-GridView1.gif

Step 6: Change Page Index

When the page index changes then again new data is obtained depending on the new page and page size.

Fill-Data-in-GridView2.gif

Step 7: First time load data

We fill the grid view when the page loads the first time.

Fill-Data-in-GridView3.gif

Step 8: Output 

Fill-Data-in-GridView4.gif

Login to add your contents and source code to this article
post comment
     

Thanks Anil !

Posted by Sandeep Singh Shekhawat Dec 09, 2012

good one :)

Posted by Anil Kumar Dec 02, 2012
COMMENT USING
PREMIUM SPONSORS
DynamicPDF™ product line allows you to dynamically generate PDF documents, merge PDF documents and add new content to existing PDF documents from within your applications.
Get Career Advice from Experts
SPONSORED BY
  • PDF reports have never been easier to create. With our included WYSIWYG Designer, you can layout your reports, set up your data source and let DynamicPDF ReportWriter do the rest.
Join a Chapter