CODEDIGEST
Home » Articles
Search
 

Technologies
 

Sponsored links
 

CodeDigest Navigation
 

Technology News
No News Feeds available at this time.
 

Community News
No News Feeds available at this time.
 
SEO Friendly Custom Paging and Jump To a Page Functionality in GridView Control Using LINQ

By Satheesh Babu
Posted On Jul 16,2009
Article Rating:
Be first to rate
this article.
No of Comments: 3
Category: ASP.Net
Print this article.

SEO Friendly Custom Paging and Jump To a Page Functionality in GridView Control Using LINQ

 

My Previous article, Custom Paging in GridView Using LINQ discussed about providing a custom paging feature to GridView control using its inbuilt paging feature and Object DataSource control. It also gave us a brief introduction on LINQ and LINQ to SQL technologies.

 The main disadvantage of the custom paging in my previous article is, the pager links are not simply a hyper link to a page. Instead, they are associated with javascript which makes a postback to bind the current page records and thus making it not search engine friendly. A link is search engine friendly if it has a target page associated with it through href property.

Search engines will automatically reach the target page and will index those pages in this case.

Moving forward, in this article we will provide custom paging for GridView control that are search engine friendly. Additionally, we will also provide jump to page feature using dropdownlist control for the GridView control.

Note

We will use the same example which binds Employee information in GridView control.

 

Search Engine Friendly Pager

We will use an ASP.Net panel control to render the pager hyperlinks.

Steps

1.      Open Visual Studio > Click File > New > Website > Select ASP.Net Website.

3.      Drag a GridView control and panel control into our ASPX page.

Refer my previous article, Custom Paging in GridView Using LINQ to create LINQ to SQL classes. We will create a data access class that has 2 methods, GetEmployeeCount() and BindEmployees(). The first method will fetch the count of employees available at that moment and the former will fetch the records that belong to a particular page.

 

public class EmployeeDAO

{

       public EmployeeDAO()

       {

              //

              // TODO: Add constructor logic here

              //

       }

    public IQueryable BindEmployees(int startRowIndex, int maximumRows)

    {

        EmployeeInfoDataContext dbEmp = new EmployeeInfoDataContext();

        var query = from emp in dbEmp.Employees

                    join dept in dbEmp.Departments

                        on emp.DeptID equals dept.DeptID

                    select new

                    {

                        EmpID = emp.EmpID,

                        EmpName = emp.EmpName,

                        Age = emp.Age,

                        Address = emp.Address,

                        DeptName = dept.DepartmentName

                    };

 

        return query.Skip(startRowIndex).Take(maximumRows);

    } 

 

    public int GetEmployeeCount()

    {

        EmployeeInfoDataContext dbEmp = new EmployeeInfoDataContext();

        return (from emp in dbEmp.Employees

         select emp).Count();    

 

    }

}

 

In the above code, the LINQ query that fetches the employee record uses join operator to get the department name from the Department table(Refer BindEmployees() method). We use Skip() and Take() operator to fetch the records that belongs to the current page.

 

Next, we will use the above methods to build the pager links with hyperlinks and bind the current page.

The below code does that,

public partial class GVPagingUsingLINQ : System.Web.UI.Page

{

    int PageSize = 2;

    protected void Page_Load(object sender, EventArgs e)

    {

        EmployeeDAO daoEmp = new EmployeeDAO();

        int TotalRows = daoEmp.GetEmployeeCount();

        int CurrentPage;

        bool res = int.TryParse(Request.QueryString["Page"], out CurrentPage);

        if (!res)

        {

            CurrentPage = 1;

        }   

      

        int PageCount = TotalRows / PageSize;       

        if (PageCount * PageSize != TotalRows)

        {

            PageCount = PageCount + 1;

        }

 

        HyperLink hplPage = null;

        Literal ltSpace = null;

        for (int i = 1; i <= PageCount; i++)

        {

            hplPage = new HyperLink();

            ltSpace = new Literal();

            ltSpace.Text = "&nbsp;";

            hplPage.Text = i.ToString();       

            //make the current page non clickable

            if (CurrentPage != i)

            {              

                hplPage.NavigateUrl = Request.CurrentExecutionFilePath + "?Page=" + i.ToString();

            }

            plPager.Controls.Add(hplPage);

            plPager.Controls.Add(ltSpace);

        }

        int StartIndex = (CurrentPage - 1) * PageSize;

        

        gvEmployee.DataSource = daoEmp.BindEmployees(StartIndex, PageSize);

        gvEmployee.DataBind();

    }

  




To have different page size, set a different value to the variable “PageSize” in the above code(i have set it as 2). Execute the page and see it in action. Refer the below figure.

CodeDigest.Com Custom GridView Paging With LINQ GVCUSPag.png

 

Next section, we will implement the 2nd part of this article which will provide jump to a page feature using dropdownlist control.

 

Jump To a Page Using DropDownList control

In this scenario, we will list all the page numbers in a DropDownList control and will bind the current page records based on the dropdownlist selection. Refer the below figure,

CodeDigest.Com Custom GridView Paging With LINQ DDLPag.png

The below code can be used to bind the dropdownlist and GridView control.

 

public partial class JumpToPaging : System.Web.UI.Page

{

    int PageSize = 2;

    protected void Page_Load(object sender, EventArgs e)

    {

       EmployeeDAO daoEmp = new EmployeeDAO();

       int CurrentPage;

        bool res = int.TryParse(ddlPage.SelectedValue,out CurrentPage);

        if (!res)

        {

            CurrentPage = 1;

        }               

         int TotalRows = daoEmp.GetEmployeeCount();

         int PageCount = TotalRows / PageSize;

         if (PageCount * PageSize != TotalRows)

           {

               PageCount = PageCount + 1;

           }

          ddlPage.Items.Clear();

         for (int i = 1; i <= PageCount; i++)

           {

              ddlPage.Items.Add(new ListItem(i.ToString(), i.ToString()));

           }

        //Make the current page selection

        ddlPage.Items.FindByValue(CurrentPage.ToString()).Selected = true;

        int StartIndex = (CurrentPage - 1) * PageSize;

        gvEmployee.DataSource = daoEmp.BindEmployees(StartIndex, PageSize);

        gvEmployee.DataBind();

 

    }

}

ASPX

<div>

      Jump To Page Number: <asp:DropDownList ID="ddlPage" runat="server" AutoPostBack="True">

        </asp:DropDownList>

        <asp:GridView ID="gvEmployee" runat="server">

        </asp:GridView>

    </div>

Execute the page and see it in action.

 

Downloads

Download Source 

Conclusion

Implementing custom paging is a bit complicated process till the release of Sql 2005. The release of SQL 2005 brought us the capability to use Row_Number() that helps us in easy custom paging implementation. This was still made easier with the release of LINQ where we can do custom paging using C# which we can understand from this article. Thus, we have seen 2 useful features that we can implement with GridView control and LINQ to SQL. Download the source attached with this article to see it in action.

Happy Coding!!

 

Similar Articles
You can contribute to CodeDiget.Com:
Donate to CodeDigest.com
Article Feedback
Comments
check range
to avoid exception add this

CurrentPage = Math.Min(CurrentPage, PageCount);
CurrentPage = Math.Max(CurrentPage, 1);
Custom paging and filtering
But when the initial value "DropDownList" I'll change
and going to the next page
Its value is changed to the initial value
Please run this code to understand that what I say.
Please help me.
Custom paging and filtering
Hi
My language is not English
Excuse me so that sentences are inaudible.
For Custom paging and filtering in GridView, I've used these codes :
<asp:DropDownList ID="ddlGroupName" runat="server" AppendDataBoundItems="true"
DataValueField="Group Name" AutoPostBack="True"
onselectedindexchanged="ddlGroupName_SelectedIndexChanged" >
</asp:DropDownList><br />
<asp:GridView ID="GV1" runat="server" AllowPaging="True">
</asp:GridView>

And in Codebehind :

using listDATableAdapters;
public partial class _Default : System.Web.UI.Page
{
int PageSize=10;
protected void Page_Load(object sender, EventArgs e)
{
if (!Page.IsPostBack)
{
BindDDL();
BindGrid();
}
}
protected void BindGrid()
{
int TotalRows;
GetListByGroupNameTableAdapter totalRowsAdapter = new GetListByGroupNameTableAdapter();
TotalRows = Convert.ToInt32(totalRowsAdapter.GetListCountByGroupName(ddlGroupName.SelectedValue));
int CurrentPage;
bool res = int.TryParse(Request.QueryString["Page"], out CurrentPage);
if (!res)
{
CurrentPage = 1;
}
int PageCount = TotalRows / PageSize;
if (PageCount * PageSize != TotalRows)
{
PageCount = PageCount + 1;
}
HyperLink hplPage = null;
Literal ltSpace = null;
for (int i = 1; i <= PageCount; i++)
{
hplPage = new HyperLink();
ltSpace = new Literal();
ltSpace.Text = "&nbsp;";
hplPage.Text = i.ToString();
if (CurrentPage != i)
{
hplPage.NavigateUrl = Request.CurrentExecutionFilePath + "?Page=" + i.ToString();
}
plPager.Controls.Add(hplPage);
plPager.Controls.Add(ltSpace);
}
int StartIndex = (CurrentPage - 1) * PageSize;
GetListByGroupNameTableAdapter GridAdapter = new GetListByGroupNameTableAdapter();
GV1.DataSource = GridAdapter.GetListByGroupName(ddlGroupName.SelectedValue, StartIndex, PageSize);
GV1.DataBind();
}
protected void BindDDL()
{
GetGroupNameTableAdapter ddlAdapter = new GetGroupNameTableAdapter();
ddlGroupName.DataSource = ddlAdapter.GetGroupName();
ddlGroupName.DataBind();
}
protected void ddlGroupName_SelectedIndexChanged(object sender, EventArgs e)
{
BindGrid();
}
}
}