zoukankan      html  css  js  c++  java
  • AspnetPager

    一、AspNetPager支持两种方式分页: 一种是PostBack方式分页, 一种是通过Url来实现分页以及Url重写功能

    二、AspNetPager支持各种数据绑定控件GridView、DataGrid、DataList、Repeater以及自定义的数据绑定控件的分页功能十分强大。

    三、AspNetPager分页控件本身并不显示任何数据,而只显示分页导航元素,数据在页面上的显示方式与该控件无关,所以需要手写数据连接方法来配合,

    四、结合TOP 。。。NOT IN 的通用存储过程分页方法使用AspNetPager十分实用

    测试控件datalist aspnetpager 的分页方法示例   分页方法为 PostBack 方式

    1、 首先将AspNetPager.dll复制于应用程序下的bin目录,打开解决方案,引入dll文件

    2、 在工具栏中添加控件,这样可以支持拖拽使用

    3、  要使用AspNetPager 要为其设置最基本的属性

     1 protected Wuqi.Webdiyer.AspNetPager AspNetPager1; 
     2 protected System.Web.UI.WebControls.Label Label1; 
     3 protected System.Web.UI.WebControls.DataList DataList1; 
     4 private void Page_Load(object sender, System.EventArgs e) 
     5 { 
     6        this.AspNetPager1.PageSize=10;     //设置每也显示的记录条数 
     7        if(!IsPostBack)                       //只在页面第一次加载时起作用 
     8        { 
     9               SqlDBManager db = new SqlDBManager(System.Configuration.ConfigurationSettings.AppSettings["SqlConnectionString"]); 
    10               AspNetPager1.RecordCount=db.CountPage("products");//获得要使用表的记录总数 
    11                                                                                              //db.CountItems自定义的方法 
    12               this.BindData();                                   
    13        } 
    14 } 
    15 private void BindData() 
    16 { 
    17        SqlDBManager db= new SqlDBManager(System.Configuration.ConfigurationSettings.AppSettings["SqlConnectionString"].ToString(); 
    18        DataList1.DataSource=db.FenPage(this.AspNetPager1.PageSize,this.AspNetPager1.CurrentPageIndex,"productid","products","productid,productname,unitprice,unitsinstock",""); 
    19 //自定义方法由 TOP not in 存储过程分页方法改编 
    20        this.DataList1.DataBind();                //控件数据绑定 
    21        this.Label1.Text="当前第"+this.AspNetPager1.CurrentPageIndex+"页 总"+this.AspNetPager1.PageCount+""; 
    22 } 
    23 private void AspNetPager1_PageChanged(object sender, System.EventArgs e) 
    24 {       //页索引改变方法 
    25     this.BindData(); 
    26 } 

    设计页效果

     1 <asp:DataList id="DataList1" style="Z-INDEX: 101; LEFT: 296px; POSITION: absolute; TOP: 96px" runat="server"> 
     2        <HeaderTemplate> 
     3               <table border='1'> 
     4                      <tr> 
     5                             <td>产品ID</td> 
     6                             <td>产品名称</td> 
     7                             <td>产品数量</td> 
     8                             <td>产品单价</td> 
     9                      </tr> 
    10        </HeaderTemplate> 
    11        <FooterTemplate> 
    12               </table> 
    13 </FooterTemplate> 
    14        <ItemTemplate> 
    15               <tr> 
    16                             <td><%# DataBinder.Eval(Container.DataItem,"Productid")%></td> 
    17                           <td><%# DataBinder.Eval(Container.DataItem,"productname")%></td> 
    18                             <td><%# DataBinder.Eval(Container.DataItem,"unitprice")%></td> 
    19                             <td><%# DataBinder.Eval(Container.DataItem,"unitsinstock")%></td> 
    20                      </tr> 
    21        </ItemTemplate> 
    22 </asp:DataList> 
    23 <webdiyer:AspNetPager id="AspNetPager1" style="Z-INDEX: 102; LEFT: 256px; POSITION: absolute; TOP: 40px" runat="server" Width="500px" FirstPageText="首页" LastPageText="尾页" NextPageText="下一页" PrevPageText="上一页" Height="40px" NumericButt PagingButt ShowNavigati ShowInputBox="Always" TextAfterInputBox="页" TextBeforeInputBox="跳转到第" AlwaysShow="True"> 
    24 </webdiyer:AspNetPager> 
    25 <asp:Label id="Label1" style="Z-INDEX: 103; LEFT: 120px; POSITION: absolute; TOP: 56px" runat="server">Label</asp:Label> 

    AspnetPager样式表

    曾祥展

    分页是Web应用程序中最常用到的功能之一,AspNetPager  简单实用,应用到项目后台中,棒极了!

    自定义样式:

    <style type="text/css">
    /*拍拍网风格*/
    .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;}
    
    /*淘宝风格*/
    .paginator { font: 12px Arial, Helvetica, sans-serif;padding:10px 20px 10px 0; margin: 0px;}
    .paginator a {border:solid 1px #ccc;color:#0063dc;cursor:pointer;text-decoration:none;}
    .paginator a:visited {padding: 1px 6px; border: solid 1px #ddd; background: #fff; text-decoration: none;}
    .paginator .cpb {border:1px solid #F50;font-weight:700;color:#F50;background-color:#ffeee5;}
    .paginator a:hover {border:solid 1px #F50;color:#f60;text-decoration:none;}
    .paginator a,.paginator a:visited,.paginator .cpb,.paginator a:hover  
    {float:left;height:16px;line-height:16px;min-width:10px;_width:10px;margin-right:5px;text-align:center;
     white-space:nowrap;font-size:12px;font-family:Arial,SimSun;padding:0 3px;}
    
    /*网易风格*/
    .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>
    前台:
    <table cellpadding="0" cellspacing="0" align="center" width="99%" class="border">
    <tr>
    <td align="left" colspan="2">
    <webdiyer:AspNetPager ID="AspNetPager1" CssClass="paginator"   CurrentPageButtonClass="cpb" runat="server" AlwaysShow="True" 
    FirstPageText="首页"  LastPageText="尾页" NextPageText="下一页"  PageSize="20" PrevPageText="上一页"  ShowCustomInfoSection="Left" 
    ShowInputBox="Never" onpagechanged="AspNetPager1_PageChanged"  CustomInfoTextAlign="Left" LayoutType="Table"  >
    </webdiyer:AspNetPager>
    </td>
    </tr>
    </table>

    后台:

    void bindData()
    {        .......绑定语句    
    this.AspNetPager1.CustomInfoHTML = string.Format("当前第{0}/{1}页 共{2}条记录 每页{3}条", new object[] { this.AspNetPager1.CurrentPageIndex, this.AspNetPager1.PageCount, this.AspNetPager1.RecordCount, this.AspNetPager1.PageSize }); } protected void AspNetPager1_PageChanged(object src, EventArgs e) { bindData(); }
  • 相关阅读:
    二分查找
    转:归并排序
    C++ STL stack和queue
    spring-第十九篇AOP面向切面编程之增强处理的优先级
    spring-第十八篇之spring AOP基于XML配置文件的管理方式
    spring-第十七篇之spring AOP基于注解的零配置方式
    spring-第十一篇之SpEL表达式
    spring-第八篇之容器中的bean的生命周期
    spring-第七篇之深入理解容器中的bean
    spring-第二篇ApplicationContext国际化及事件机制
  • 原文地址:https://www.cnblogs.com/lyghost/p/2486472.html
Copyright © 2011-2022 走看看