Custom DataGrid With Next, Previous, First, Last, and Numeric Paging

Introduction

In one of my web projects, the requirement was such that the pager should have numeric paging as well as links for previous, next, first, and last pages. The DataGrid did not directly support this type of layout; that's why I have developed my custom DataGrid that can be used throughout.

Background

The basic idea is very simple: Create a custom control that is inherited by DataGrid and overrides the ItemCreated event. Here, you have to understand how DataGrid renders controls for Pager. The DataGrid renders controls like this (LinkButton or label) (Literal control) (LinkButton or label) ... and so on. Literals are used to put space between controls and Labels are used to show disabled pager links.

You can calculate the total pages from the items in the pager cell by using this formula:

TotalPages = (e.Item.Cells[0].Controls.Count /2) +1

This count is useful for assigning the command argument for ImageButton for the last page. The onItemCreated event is written below.

Using the Code

Just add the MycustomDG.dll in the VS .NET toolbar or add a reference to MycustomDG.dll. Assign the following properties:

  • ShowPreviousAndNextImage
  • ShowFirstAndLastImage
  • ImageFirst
  • ImageLast
  • ImagePrevious
  • ImageNext

Code for OnItemCreated

protected override void OnItemCreated(DataGridItemEventArgs e)
{
   if(e.Item.ItemType == ListItemType.Pager)
   {
      int _TotalCount  = e.Item.Cells[0].Controls.Count;
      int _TotalPagers = (_TotalCount/ 2) +1;
      int _CurrentPage = this.CurrentPageIndex;
      if(_TotalCount > 1)
      {
         LinkButton btnPrev  = new LinkButton();
         LinkButton btnNext  = new LinkButton();
         LinkButton btnFirst = new LinkButton();
         LinkButton btnLast  = new LinkButton();

         if(_Show_Prev_Next_Image)
         {
            #region Next & previous
            if(_CurrentPage +1 <= _TotalPagers )
            {    // Enable Next
               string sImgNext ="<img alt='Next' border='0'
                                 src='"+ _ImgNext+"'>";
               btnNext.Text = sImgNext;
               btnNext.CommandArgument = (_CurrentPage+2).ToString();
               btnNext.CommandName = "Page";
               btnNext.Enabled = true;
            }
            else
            {    // disable next
               string sImgNext ="<img alt='Next' border='0'
                                 src='"+ _ImgNext+"'>";
               btnNext.Text = sImgNext;
               btnNext.Enabled = false;
            }

            if(_CurrentPage > 0)
            {    // enable Previous
               string sImgPre ="<img alt='Previous' border='0'
                                src='"+ _ImgPrev+"'>";
               btnPrev.Text = sImgPre;
               btnPrev.CommandName = "Page";
               btnPrev.CommandArgument = (_CurrentPage).ToString();
               btnPrev.Enabled = true;
            }
            else
            {    // disable previous
               string sImgPre ="<img alt='Previous' border='0'
                                src='"+ _ImgPrev+"'>";
               btnPrev.Text = sImgPre;
               btnPrev.Enabled = false;
            }
            #endregion
         }


         if(_Show_First_Last_Image)
         {
            #region First & last
            if(e.Item.Cells[0].Controls[_TotalCount -1].GetType() !=
               typeof(System.Web.UI.WebControls.Label))
            {
               string sImgNext ="<img alt='Last' border='0'
                                 src='"+ _ImageLast+"'>";
               btnLast.CommandArgument = _TotalPagers.ToString();
               btnLast.CommandName = "Page";
               btnLast.Text = sImgNext;
               btnLast.Enabled = true;
            }
            else
            {
               string sImgNext ="<img alt='Last' border='0'
                                 src='"+ _ImageLast+"'>";
               btnLast.Text = sImgNext;
               btnLast.Enabled = false;
            }


            if(e.Item.Cells[0].Controls[0].GetType() !=
               typeof(System.Web.UI.WebControls.Label))
            {
               string sImgPre ="<img alt='First' border='0'
                                src='"+ _ImageFirst+"'>";
               btnFirst.CommandArgument = "1";
               btnFirst.CommandName = "Page";
               btnFirst.Text = sImgPre;
               btnFirst.Enabled = true;
            }
            else
            {
               string sImgPre ="<img alt='First' border='0'
                                src='"+ _ImageFirst+"'>";
               btnFirst.Text = sImgPre;
               btnFirst.Enabled = false;
            }
            #endregion
         }


         e.Item.Cells[0].Controls.AddAt(0,btnPrev);
         e.Item.Cells[0].Controls.AddAt(e.Item.Cells[0].Controls.Count,
                                        btnNext);
         // Add These 2 Images at the First and last Position
         e.Item.Cells[0].Controls.AddAt(0,btnFirst);
         e.Item.Cells[0].Controls.AddAt(e.Item.Cells[0].Controls.Count,
                                        btnLast);
      }
   }
   base.OnItemCreated (e);
}


About the Author

saifi hasan

I have been in development Web Application, Web Sevices for last 3 yrs.Currently working with TCS India

Downloads

Comments

Leave a Comment
  • Your email address will not be published. All fields are required.

Top White Papers and Webcasts

  • Complex hybrid environments can make it difficult to track interdependencies, increasing the risk of disrupting critical business services. In this white paper by EMA, you'll learn how application discovery and dependency mapping can help you: Meet granular targets for availability, cost, and time-to-revenue for cloud services. Accelerate mean time to repair (MTTR) while communicating better with stakeholders. Manage even the most complex hybrid environments more efficiently and effectively Understand the …

  • Rocket Mobile® for IBM i is an enterprise mobile application development and deployment platform for customers who rely on the IBM i system. Rocket Mobile for IBM i enables customers to leave proven applications in-place and rapidly repurpose them into new managed and secure mobile applications. Fast, easy creation of mobile, web, and hybrid mobile applications that deploy to any iOS, Android, or Windows mobile phone or tablet Built-in integration for seamless repurposing of existing IBM i applications …

Most Popular Programming Stories

More for Developers

RSS Feeds

Thanks for your registration, follow us on our social networks to keep up-to-date