Custom Paging in datagrid using c# in ASP.NET

• Download demo project - 25 Kb
• Download source - 43 Kb

Introduction & Background

While I was working in a project written in C# and in an Arabic (my native) language as UI Language, I faced a lot of problems regarding the UI but, they were easy to fix.

But, I faced a big problem regarding the Paging in the DataGrid, the number simply changed the order (sequence) from right to left just with the dir attribute='rtl' (Right to Left) but, the Next and Previous links weren't the same, as the Arabic language is Right to Left alignment the next link was at the begging and the previous link was at the end and this is not correct in Arabic.

Further more, the client didn't like the paging style, so, I had to do something, I thought of doing a Panel for navigation for the DataGrid and associate it with it, but, it will require a lot of code and then testing and I didn't like this approach.

Finally, I found the following solution:

First, I wrote an extension class for the DataGrid and I have added couple of attributes like "Direction (Dir)" and number of sequence pages numbers that should be displayed.

afterward, I had to write a custom DataGridItem in order to control the hosted child controls. Then, I wrote CustomLinkButton to extend the LinkButton functionlity, I needed to add a space after each link, so, I made an override of the Render method, plus I wrote code to manipulate the HTML Text Direction too.

Using the code

Now let's look at the main class for the Customized DataGridItem,

/// <summary>
/// Here is the core code to initilize and format the output of
/// the CustomDataGridItem.
/// </summary>
protected override void CreateChildControls()
{
TableCell tc = new TableCell();
CustomLinkButton lb;


StartingIndex = ((CustomPagingGrid)this.Parent.Parent).CurrentStartingIndex;
CurrentPage = ((DataGrid)this.Parent.Parent ).CurrentPageIndex ;
PagesCount = ((DataGrid)this.Parent.Parent ).PageCount ;



tc.ColumnSpan = GetColumnsCount();


Controls.Clear();


// The Prevous Link 
if (StartingIndex-DisplayPagesCount >= 0)
{
lb = new CustomLinkButton(_Direction);
lb.Text="Previous";
lb.CommandName ="P"+ StartingIndex.ToString();
lb.Click += new EventHandler(this.Link_Click);
tc.Controls.Add(lb);
}

// the sequence numbers Links.
for(int i=StartingIndex ;i < 
  ( (StartingIndex+DisplayPagesCount > 
     PagesCount)?PagesCount-StartingIndex: 
     StartingIndex+DisplayPagesCount) ; i++)
{
lb = new CustomLinkButton (_Direction);

if (i==CurrentPage)
lb.Enabled = false;

lb.Text=(i+1).ToString();
lb.CommandName =(i).ToString();
lb.Click += new EventHandler(this.Link_Click);
tc.Controls.Add(lb);
}

// the Next Link
if (StartingIndex+DisplayPagesCount<PagesCount)
{
lb = new CustomLinkButton(_Direction);
lb.Text="Next";
lb.CommandName ="N"+ StartingIndex.ToString();
lb.Click += new EventHandler(this.Link_Click);
tc.Controls.Add(lb);
}

Controls.Add(tc);
}

As you can see that the overridden Method CreateChildControls overrides the base method and it creates the controls which in turn will be added to a TableCell control which in turn will be added to the DataGridItem.

The rest of the code it just easy, except there is a method called GetColumnsCount which I have used Reflection to obtain the Grid's Column's count, because the autoGenColumnsArray is a private field in the DataGrid class, and before the binding process you can't determine how many columns you have in the Grid, that's why I found this field has the correct number of columns but, in an Array format - Array of Columns -, I just need it's count no more.

Conclusion

Ok, what's the importance of a customized Paging for Arabic layout? Well, I have got some additional ideas. Maybe one day, you will need to have a new paging style(s) like, DropDownList with the list of pages, or you may change the style from Link to Button or even attach a TextBox along with Button for searching the results.

anyway, there are numerous ideas, just you have the concept and the sample code off course.

History

Before this article I was just a reader, and I really enjoyed it. It's great service that you Guys ( CodeProject Team ) provide.

and I hope it won't be my last article, because, I'm extremely busy.

Thank you all,