Aspdotnet-Suresh

aspdotnet-suresh offers C#.net articles and tutorials,csharp dot net,asp.net articles and tutorials,VB.NET Articles,Gridview articles,code examples of asp.net 2.0 /3.5,AJAX,SQL Server Articles,examples of .net technologies

Asp.net gridview custom paging example like Numeric, first, previous, next and last

Mar 26, 2011
Introduction:

Here I will explain how to show the gridview with custom paging like numeric first, previous, next, last in asp.net

Description:

In previous post I explained
gridview with different types of paging with available paging options in gridview but now if we want to display the gridview with custom paging like Numeric, first, previous, next and last for that we need to write some code to show the gridview paging like what we except and here I used gridview with pagertemplate to create the paging in gridview effectively for that create new website and design the aspx page like this



<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<title>Show Gridview To</title>
<style type="text/css">
.Gridview
{
font-family:Verdana;
font-size:11pt;
font-weight:normal;
color:black;
width:350px;
}
.Linkbutton
{
color:White;

}
</style>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:GridView ID="gvEmpDetails" runat="server" CssClass="Gridview" PageSize="5" AllowPaging="true" DataSourceID="dsEmpdetails" OnRowCreated= "gvEmpDetails_RowCreated" OnDataBound="gvEmpDetails_DataBound" >
<RowStyle BackColor="#EFF3FB" />
<FooterStyle BackColor="#507CD1" Font-Bold="True" ForeColor="White" />
<PagerStyle BackColor="#2461BF" ForeColor="White" HorizontalAlign="Center" />
<HeaderStyle BackColor="#507CD1" Font-Bold="True" ForeColor="White" />
<AlternatingRowStyle BackColor="White" />
<PagerTemplate>
<asp:LinkButton ID="LinkButton1" runat="server" CommandName="Page" CommandArgument="First" CssClass="Linkbutton">First</asp:LinkButton>
<asp:Label ID="pmore" runat="server" Text="..."></asp:Label>
<asp:LinkButton ID="LinkButton2" runat="server" CommandName="Page" CommandArgument="Prev" CssClass="Linkbutton">Pre</asp:LinkButton>
<asp:LinkButton ID="p0" runat="server" CssClass="Linkbutton">LinkButton</asp:LinkButton>
<asp:LinkButton ID="p1" runat="server" CssClass="Linkbutton">LinkButton</asp:LinkButton>
<asp:LinkButton ID="p2" runat="server" CssClass="Linkbutton">LinkButton</asp:LinkButton>
<asp:Label ID="CurrentPage" runat="server" Text="Label"></asp:Label>
<asp:LinkButton ID="p4" runat="server" CssClass="Linkbutton">LinkButton</asp:LinkButton>
<asp:LinkButton ID="p5" runat="server" CssClass="Linkbutton">LinkButton</asp:LinkButton>
<asp:LinkButton ID="p6" runat="server" CssClass="Linkbutton">LinkButton</asp:LinkButton>
<asp:LinkButton ID="LinkButton3" runat="server" CommandName="Page" CommandArgument="Next" CssClass="Linkbutton">Next</asp:LinkButton>
<asp:Label ID="nmore" runat="server" Text="..."></asp:Label>
<asp:LinkButton ID="LinkButton4" runat="server" CommandName="Page" CommandArgument="Last" CssClass="Linkbutton">Last</asp:LinkButton>
</PagerTemplate>
</asp:GridView>
<asp:SqlDataSource ID="dsEmpdetails" runat="server" ConnectionString="<%$ConnectionStrings:dbconnection %>"
SelectCommand="select * from Country" >
</asp:SqlDataSource>
</div>
</form>
</body>
</html>
After that write the following code in code behind for gridview custom paging


protected void gvEmpDetails_DataBound(object sender, EventArgs e)
{
GridViewRow gvrow = gvEmpDetails.BottomPagerRow;
Label lblcurrentpage = (Label)gvrow.Cells[0].FindControl("CurrentPage");
lblcurrentpage.Text = Convert.ToString(gvEmpDetails.PageIndex + 1);
int[] page = new int[7];
page[0] = gvEmpDetails.PageIndex - 2;
page[1] = gvEmpDetails.PageIndex - 1;
page[2] = gvEmpDetails.PageIndex;
page[3] = gvEmpDetails.PageIndex + 1;
page[4] = gvEmpDetails.PageIndex + 2;
page[5] = gvEmpDetails.PageIndex + 3;
page[6] = gvEmpDetails.PageIndex + 4;
for (int i = 0; i < 7; i++)
{
if (i != 3)
{
if (page[i] < 1 || page[i] > gvEmpDetails.PageCount)
{
LinkButton lnkbtn = (LinkButton)gvrow.Cells[0].FindControl("p" + Convert.ToString(i));
lnkbtn.Visible = false;
}
else
{
LinkButton lnkbtn = (LinkButton)gvrow.Cells[0].FindControl("p" + Convert.ToString(i));
lnkbtn.Text = Convert.ToString(page[i]);
lnkbtn.CommandName = "PageNo";
lnkbtn.CommandArgument = lnkbtn.Text;

}
}
}
if (gvEmpDetails.PageIndex == 0)
{
LinkButton lnkbtn = (LinkButton)gvrow.Cells[0].FindControl("LinkButton1");
lnkbtn.Visible = false;
lnkbtn = (LinkButton)gvrow.Cells[0].FindControl("LinkButton2");
lnkbtn.Visible = false;

}
if (gvEmpDetails.PageIndex == gvEmpDetails.PageCount - 1)
{
LinkButton lnkbtn = (LinkButton)gvrow.Cells[0].FindControl("LinkButton3");
lnkbtn.Visible = false;
lnkbtn = (LinkButton)gvrow.Cells[0].FindControl("LinkButton4");
lnkbtn.Visible = false;

}
if (gvEmpDetails.PageIndex > gvEmpDetails.PageCount - 5)
{
Label lbmore = (Label)gvrow.Cells[0].FindControl("nmore");
lbmore.Visible = false;
}
if (gvEmpDetails.PageIndex < 4)
{
Label lbmore = (Label)gvrow.Cells[0].FindControl("pmore");
lbmore.Visible = false;
}
}

void lb_Command(object sender, CommandEventArgs e)
{
gvEmpDetails.PageIndex = Convert.ToInt32(e.CommandArgument) - 1;
}

protected void gvEmpDetails_RowCreated(object sender, GridViewRowEventArgs e)
{

if (e.Row.RowType == DataControlRowType.Pager)
{
GridViewRow gvr = e.Row;
LinkButton lb = (LinkButton)gvr.Cells[0].FindControl("p0");
lb.Command += new CommandEventHandler(lb_Command);
lb = (LinkButton)gvr.Cells[0].FindControl("p1");
lb.Command += new CommandEventHandler(lb_Command);
lb = (LinkButton)gvr.Cells[0].FindControl("p2");
lb.Command += new CommandEventHandler(lb_Command);
lb = (LinkButton)gvr.Cells[0].FindControl("p4");
lb.Command += new CommandEventHandler(lb_Command);
lb = (LinkButton)gvr.Cells[0].FindControl("p5");
lb.Command += new CommandEventHandler(lb_Command);
lb = (LinkButton)gvr.Cells[0].FindControl("p6");
lb.Command += new CommandEventHandler(lb_Command);
}
}
After that set your database connection in web.config like this


<connectionStrings>
<add name="dbconnection" connectionString="Data Source=SureshDasari;Integrated Security=true;Initial Catalog=MySampleDB"/>
</connectionStrings >
Demo

Download sample code attached



If you enjoyed this post, please support the blog below. It's FREE!

Get the latest Asp.net, C#.net, VB.NET, jQuery, Plugins & Code Snippets for FREE by subscribing to our Facebook, Twitter, RSS feed, or by email.

subscribe by rss Subscribe by RSS subscribe by email Subscribe by Email

13 comments :

krish said...

Hi Suresh,

Nice Posting... do you have any posting like dynamically retrieving 10 records only after clicking the NEXT button, not initially to fill all in the dataset. This is because if i have 10,000 record cant load all the records at a time. Do you have any solution for this... Thank you.

Anonymous said...

BottomPagerRow not comming in grid property

smspostbox said...

Very nice.....

Unknown said...

hi sir .........happy vinayaka chavathi ....sir it is very good but i need paging option with that i should display previous and present at a time and that should add th next one also like if i click on 2nd page it should display 1stpage and 2nd page information and if i click 4th link it should display 1st,2nd and 3rd page information.....

Anonymous said...

Am adding one gridview webpart & apply allow paging ,when m clicking
next page the page remains same ,if m click again on the next page
then it will show the next page ,so for each page i have to click
double .So plz tell me what changes have to be done in code.

Anonymous said...

i want the proper custom paging control, please, if anyone can help.

click here said...

Hi,sir.I like your advice.I will go back and try your way.

Anonymous said...

Nice article

piyush said...

Getting BottomPagerRow is null .
please tell what can be the reason behind that

Unknown said...

could you give me some code by vb? please help me,please send the code by mail christianys14@gmail.com. thanks for your help,i need the code asap.

Unknown said...

Hi suresh,

It is wonderful.

showing error i.e., pageindexing
But,Pageindexing is not added in the code.

By adding the below code

protected void gvDetails_PageIndexChanging(object sender, GridViewPageEventArgs e)
{
gvDetails.PageIndex = e.NewPageIndex;
BindDetails();
}
gridview paging is working fine.

Anonymous said...

Put demos for the given Examples

Anonymous said...

hi , i'm sorry for my Inglés , but thanks, i'm starting with , and your demo was very usefull.
Thanks fron chile

Give your Valuable Comments

Note: Only a member of this blog may post a comment.

© 2015 Aspdotnet-Suresh.com. All Rights Reserved.
The content is copyrighted to Suresh Dasari and may not be reproduced on other websites without permission from the owner.