使用AspNetPage控件实现分页 .
AspNetPager针对ASP.NET分页控件的不足,提出了与众不同的解决asp.net中分页问题的方案,即将分页导航功能与数据显示功能完全独立开来,由用户自己控制数据的获取及显示方式,因此可以被灵活地应用于任何需要实现分页导航功能的地方,如为GridView、DataList以及Repeater等数据绑定控件实现分页、呈现自定义的分页数据以及制作图片浏览程序等,因为AspNetPager控件和数据是独立的,因此要分页的数据可以来自任何数据源,如SQL Server、Oracle、Access、mysql、DB2等数据库以及XML文件、内存数据或缓存中的数据、文件系统等等。
基本属性:
AlwaysShow:
默认情况下,当要分页的数据只有一页时,AspNetPager默认会自动危险期而不在页面上显示任何可见内容,将此属性值设为true时,即使总页数只有一页,AspNetPager也将显示分页导航元素。
FirstPageText:
获取或设置为第一页按钮显示的文本。
LastPageText:
获取或设置为最后一页按钮显示的文本。
NextPageText:
获取或设置为下一页按钮显示的文本。
PrevPageText:
获取或设置为上一页按钮显示的文本。
PageSize:
获取或设置每页显示的项数。(该值获取或设置数据呈现控件每次要显示数据表中的的数据的项数,AspNetPager根据该值和 RecordCount 来计算显示所有数据需要的总页数,即 PageCount的值。 )
CssClass:
应用于控件的css类名
CurrentPageButtonClass:
获取或设置AspNetPager分页控件当前页导航按钮的级联样式表 (CSS) 类。
PageIndexBoxType:
或者或设置页索引框的显示类型,可以是允许用户手工输入的文本框和只能选择的下拉框。
ShowBoxThreshold:
当 ShowPageIndexBox 设为Auto(默认)并且要分页的数据的总页数达到该值时会自动显示页索引输入文本框,默认值为30。该选项当 ShowPageIndexBox 设为Never或Always时没有任何作用。
首先,复制一下AspNetPage的dll到Bin目录下,引用它,然后可以把它拖到页面内。
在这里我使用的是Repeater进行数据显示
这是前台Repeater绑定代码
- <asp:Repeater ID="Show_List" runat="server">
- <ItemTemplate>
- <span class="listitem">
- <div class="pic"><a href='detail.aspx?id=<%#Eval("ID") %>'><img src="<%#Eval("ShuoImsge").ToString() %>" class="imgborder" width="92" height="92" alt="<%#Eval("Title") %>" /></a></div>
- <div class="textarea">
- <span class="title"><a href='detail.aspx?id=<%#Eval("ID") %>'><%#Eval("Title")%></a></span>
- <span style="display:block;padding:2px"><%# Eval("Title")%></span>
- <span style="display:block;font-size:14px;padding:2px">发布日期 <%#Eval("addtime","{0:yyyy-MM-dd}")%></span>
- <a href="/AddToCart.ashx?id=<%#Eval("ID") %>"><span class="itembtn1"></span>
- <span class="itembtn2" style="width:120px">$:<%#Eval("ProductPrice")%> <font color="red">购买产品</font></span>
- <span class="itembtn3"></span></a>
- </div>
- </span>
- </ItemTemplate>
- </asp:Repeater>
<asp:Repeater ID="Show_List" runat="server">
<ItemTemplate>
<span class="listitem">
<div class="pic"><a href='detail.aspx?id=<%#Eval("ID") %>'><img src="<%#Eval("ShuoImsge").ToString() %>" class="imgborder" width="92" height="92" alt="<%#Eval("Title") %>" /></a></div>
<div class="textarea">
<span class="title"><a href='detail.aspx?id=<%#Eval("ID") %>'><%#Eval("Title")%></a></span>
<span style="display:block;padding:2px"><%# Eval("Title")%></span>
<span style="display:block;font-size:14px;padding:2px">发布日期 <%#Eval("addtime","{0:yyyy-MM-dd}")%></span>
<a href="/AddToCart.ashx?id=<%#Eval("ID") %>"><span class="itembtn1"></span>
<span class="itembtn2" style="width:120px">$:<%#Eval("ProductPrice")%> <font color="red">购买产品</font></span>
<span class="itembtn3"></span></a>
</div>
</span>
</ItemTemplate>
</asp:Repeater>
这里是AspNetPage控件前台代码
- <webdiyer:AspNetPager ID="AspNetPager1" runat="server" ForeColor="red" CurrentPageButtonClass="cpb" AlwaysShow="True" FirstPageText="首页" LastPageText="尾页" PageSize="18" OnPageChanged="AspNetPager1_PageChanged" ></webdiyer:AspNetPager>
<webdiyer:AspNetPager ID="AspNetPager1" runat="server" ForeColor="red" CurrentPageButtonClass="cpb" AlwaysShow="True" FirstPageText="首页" LastPageText="尾页" PageSize="18" OnPageChanged="AspNetPager1_PageChanged" ></webdiyer:AspNetPager>
下面是后台的,如果对效率不是有特别高的要求,完全可以直接使用sql语句进行查询,将查询到的数据赋给控件,他会根据你的设置来显示数据。
数据绑定
- private void show_Bind()
- {
- GetCount();
- string sql = @"select a.ID,a.Title,a.ShuoImsge,a.SmallClassId,b.commodity,b.CategoryID,a.addtime
- ,a.ProductPrice from softContent a,MyCommodityCategory b
- where a.SmallClassId=b.id";
- SqlConnection conn = new SqlConnection(DataSqlAdaper.wpConnStr);
- conn.Open();
- SqlCommand cmd = new SqlCommand(sql,conn);
- SqlDataAdapter sda = new SqlDataAdapter();
- sda.SelectCommand = cmd;
- DataSet ds = new DataSet();
- sda.Fill(ds, AspNetPager1.PageSize * (this.AspNetPager1.CurrentPageIndex - 1), AspNetPager1.PageSize, "temp");
- DataTable dt = ds.Tables["temp"];
- Show_List.DataSource = dt;
- Show_List.DataBind();
- conn.Close();
- }
private void show_Bind()
{
GetCount();
string sql = @"select a.ID,a.Title,a.ShuoImsge,a.SmallClassId,b.commodity,b.CategoryID,a.addtime
,a.ProductPrice from softContent a,MyCommodityCategory b
where a.SmallClassId=b.id";
SqlConnection conn = new SqlConnection(DataSqlAdaper.wpConnStr);
conn.Open();
SqlCommand cmd = new SqlCommand(sql,conn);
SqlDataAdapter sda = new SqlDataAdapter();
sda.SelectCommand = cmd;
DataSet ds = new DataSet();
sda.Fill(ds, AspNetPager1.PageSize * (this.AspNetPager1.CurrentPageIndex - 1), AspNetPager1.PageSize, "temp");
DataTable dt = ds.Tables["temp"];
Show_List.DataSource = dt;
Show_List.DataBind();
conn.Close();
}
获得总条数
- private void GetCount()
- {
- string sql="select count(*) from softContent";
- this.AspNetPager1.RecordCount =Convert.ToInt32( DataSqlAdaper.ExecuteScalar(DataSqlAdaper.wpConnStr,CommandType.Text,sql));//这里是查询出总条数
- this.AspNetPager1.PageSize = 18;//这是设置每页显示多少条数据
- }
private void GetCount()
{
string sql="select count(*) from softContent";
this.AspNetPager1.RecordCount =Convert.ToInt32( DataSqlAdaper.ExecuteScalar(DataSqlAdaper.wpConnStr,CommandType.Text,sql));//这里是查询出总条数
this.AspNetPager1.PageSize = 18;//这是设置每页显示多少条数据
}
最后需要添加一个AspNetPager_PageChanged事件
- protected void AspNetPager1_PageChanged(object sender, EventArgs e)
- {
- show_Bind();
- }
protected void AspNetPager1_PageChanged(object sender, EventArgs e)
{
show_Bind();
}
在上面的那个博客上看到有几个样式,就摘过来了,方便以后参考。
===== 网易风格 =====
.anpager .cpb {background:#1F3A87 none repeat scroll 0 0;border:1px solid #CCCCCC;color:#FFFFFF;font-weight:bold;margin:5px 4px 0 0;padding:4px 5px 0;}
.anpager a {background:#FFFFFF none repeat scroll 0 0;border:1px solid #CCCCCC;color:#1F3A87;margin:5px 4px 0 0;padding:4px 5px 0;text-decoration:none}
.anpager a:hover{background:#1F3A87 none repeat scroll 0 0;border:1px solid #1F3A87;color:#FFFFFF;}
属性设置:CssClass="anpager" CurrentPageButtonClass="cpb"
===== 拍拍网风格 =====
.paginator { font: 11px Arial, Helvetica, sans-serif;padding:10px 20px 10px 0; margin: 0px;}
.paginator a {padding: 1px 6px; border: solid 1px #ddd; background: #fff; text-decoration: none;margin-right:2px}
.paginator a:visited {padding: 1px 6px; border: solid 1px #ddd; background: #fff; text-decoration: none;}
.paginator .cpb {padding: 1px 6px;font-weight: bold; font-size: 13px;border:none}
.paginator a:hover {color: #fff; background: #ffa501;border-color:#ffa501;text-decoration: none;}
属性设置:CssClass="paginator" CurrentPageButtonClass="cpb"
===== 迅雷风格 =====
.pages { color: #999; }
.pages a, .pages .cpb { text-decoration:none;float: left; padding: 0 5px; border: 1px solid #ddd;background: #ffff;margin:0 2px; font-size:11px; color:#000;}
.pages a:hover { background-color: #E61636; color:#fff;border:1px solid #E61636; text-decoration:none;}
.pages .cpb { font-weight: bold; color: #fff; background: #E61636; border:1px solid #E61636;}
属性设置:CssClass="pages" CurrentPageButtonClass="cpb"
关于样式调用直接将样式添加到<style type="text/css"></style>当中,然后在控件的前台代码添加一句CssClass="anpager" CurrentPageButtonClass="cpb" 就可以了。

浙公网安备 33010602011771号