AspNetPager分页控件的使用

先看效果图：

 

先下载AspNetPager.dll再在项目中引用该dll。

在前台页面中：

首先引用程序集：

<%@ Register Assembly="AspNetPager" Namespace="Wuqi.Webdiyer" TagPrefix="webdiyer" %>l

使用代码：

<asp:datalist id="MyDataGrid" RepeatDirection="Horizontal" RepeatColumns="3" showfooter="true" borderwidth="0" runat="server">

                 <HeaderTemplate>

                 <table width="784" cellpadding="0" cellspacing="0" border="0" >

                 <tr>

                 </HeaderTemplate>

                 <ItemTemplate>

                         <td align="center">

                          <table width="100%" height="120">                        

                          <tr>

                          <td align="center">

                           名称： <%# DataBinder.Eval(Container.DataItem, "EmployName")%>

                          </td>

                          </tr>

                           </table>

                        </td>   

              </ItemTemplate>

              <FooterTemplate>

                </tr>

                  </table>

              </FooterTemplate>

           </asp:datalist>

           <div class="msdn">

      <webdiyer:AspNetPager ID="anp_mes" runat="server" FirstPageText="首页"

            LastPageText="尾页" NextPageText="下一页" PrevPageText="上一页"

            onpagechanging="anp_mes_PageChanging" PageIndexBoxType="DropDownList"

            ShowPageIndexBox="Always" SubmitButtonText="GO" TextAfterPageIndexBox="页"

            TextBeforePageIndexBox="转到" CurrentPageButtonClass="current">

      </webdiyer:AspNetPager>

      <div></div>

      </div>

后台代码：

protected void Page_Load(object sender, EventArgs e)

        {

            if (!IsPostBack)

            {

               // anp_mes.AlwaysShow = true;

                anp_mes.PageSize = 2;

                string sql = "select count(*) from SYS_Employee";

                string sqlConn = "Data Source=.//sqlexpress;Initial Catalog=GHRQ;Integrated Security=True";

                SqlConnection conn = new SqlConnection(sqlConn);

                conn.Open();

                SqlCommand cmd = new SqlCommand(sql, conn);

                anp_mes.RecordCount =(int) cmd.ExecuteScalar();

                conn.Close();

                DataViewbind();

            }

        }      

  

 

        private void DataViewbind()

        {

           string sql = "select * from SYS_Employee";

            string sqlConn = "Data Source=.//sqlexpress;Initial Catalog=GHRQ;Integrated Security=True";

            SqlConnection conn = new SqlConnection(sqlConn);

            conn.Open();

 

            SqlCommand cmd = new SqlCommand(sql, conn);

 

            SqlDataAdapter da = new SqlDataAdapter(cmd);

            DataSet ds = new DataSet();

            da.Fill(ds,anp_mes.PageSize*(anp_mes.CurrentPageIndex-1), anp_mes.PageSize, "table");       

 

          

            MyDataGrid.DataSource = ds.Tables[0];

            conn.Close();

            MyDataGrid.DataBind();

        }

 

        protected void anp_mes_PageChanging(object src, Wuqi.Webdiyer.PageChangingEventArgs e)

        {

            anp_mes.CurrentPageIndex = e.NewPageIndex;

            DataViewbind();

        }

CSS样式（网上有很多样式可自行更改）：

<style type="text/css">

     /*CSS msdn style pagination*/

DIV.msdn {

    PADDING-RIGHT: 6px; PADDING-LEFT: 0px; FONT-SIZE: 13px; PADDING-BOTTOM: 4px; COLOR: #313031; PADDING-TOP: 4px; FONT-FAMILY: Verdana,Tahoma,Arial,Helvetica,Sans-Serif; BACKGROUND-COLOR: #fff; TEXT-ALIGN:left; margin-bottom:5px;

}

DIV.msdn A {

    BORDER-RIGHT: #b7d8ee 1px solid; PADDING-RIGHT: 6px; BORDER-TOP: #b7d8ee 1px solid; PADDING-LEFT: 5px; PADDING-BOTTOM: 4px; MARGIN: 0px 3px; BORDER-LEFT: #b7d8ee 1px solid; COLOR: #0030ce; PADDING-TOP: 5px; BORDER-BOTTOM: #b7d8ee 1px solid; TEXT-DECORATION: none

}

DIV.msdn A:hover {

    BORDER-RIGHT: #b7d8ee 1px solid; BORDER-TOP: #b7d8ee 1px solid; BORDER-LEFT: #b7d8ee 1px solid; COLOR: #0066a7; BORDER-BOTTOM: #b7d8ee 1px solid; BACKGROUND-COLOR: #d2eaf6

}

DIV.pagination A:active {

    BORDER-RIGHT: #b7d8ee 1px solid; BORDER-TOP: #b7d8ee 1px solid; BORDER-LEFT: #b7d8ee 1px solid; COLOR: #0066a7; BORDER-BOTTOM: #b7d8ee 1px solid; BACKGROUND-COLOR: #d2eaf6

}

DIV.msdn SPAN.current {

    BORDER-RIGHT: #b7d8ee 1px solid; PADDING-RIGHT: 6px; BORDER-TOP: #b7d8ee 1px solid; PADDING-LEFT: 5px; FONT-WEIGHT: bold; PADDING-BOTTOM: 4px; MARGIN: 0px 3px; BORDER-LEFT: #b7d8ee 1px solid; COLOR: #444444; PADDING-TOP: 5px; BORDER-BOTTOM: #b7d8ee 1px solid; BACKGROUND-COLOR: #d2eaf6

}

DIV.msdn SPAN.disabled {

    DISPLAY: none

}

</style>

设置控件的CurrentPageButtonClass属性：current

如果要设置第几页，共多少页或者多少条记录，添加如下属性：

CustomInfoTextAlign="Right" CustomInfoSectionWidth="100px"
                   CustomInfoHTML="第%CurrentPageIndex%/%PageCount%页&nbsp;共%RecordCount%条"
                   CurrentPageButtonClass="current" ShowCustomInfoSection="Left"  CustomInfoClass="pages"

以CSS中添加：

.pages{ font-size:12px; padding-right:6px; padding-bottom:4px; padding-top:5px; font-weight:bold;}

可以用“%”+属性名+“%”来代替该属性的值，控件在运行时会将“%”+属性名+“%”替换为相应的属性的值，其中的“属性名”仅适用于下列属性：

• RecordCount：记录总数
• PageCount：总页数
• CurrentPageIndex：当前页索引
• StartRecordIndex：当前页起始记录的索引
• EndRecordIndex：当前页最后一条记录的索引
• PageSize：每页显示的记录项数
• PagesRemain：当前页之后剩余的未显示的记录的页数
• RecordsRemain：当前页之后剩余的未显示的记录总项数

属性名不区分大小写，所以“%RecordCount%”可以写为“%recordcount%”。

 

更多有关控件的属性、方法的说明请查看：http://www.webdiyer.com/AspNetPagerDocs/