程式師世界 >> 編程語言 >> .NET網頁編程 >> .NET實例教程 >> 用AspNetPager控件最詳細的分頁實現方法（親自實踐）

用AspNetPager控件最詳細的分頁實現方法（親自實踐）

編輯：.NET實例教程

祝賀一下~好不容易把分頁做出來了。之前都是用GridVIEw自帶的分頁，版式難看不說，還極不優化，一次取出所有記錄，然後進行假分頁。
現在用ASPNetPager控件做出的真分頁，就好多了，不過還有改進的地方，SQL語句如果換成存儲過程效率會更高。

首先在SqlHelper.cs（DAL層中的數據庫助手類，用於寫可以復用的基本增刪查改方法）中加上以下代碼：

Code
/**//// <summary>
        /// 獲取分頁數據
        /// </summary>
        /// <param name="sql">sql語句</param>
        /// <param name="currentPage">當前頁</param>
        /// <param name="pagesize">每頁顯示數</param>
        /// <param name="recordcount"></param>
        /// <returns></returns>
        public static DataSet GetPage(string sql, int currentPage, int pagesize, out int recordcount)
        {
            openCon();
            sqlDs.Clear();

            sqlDa = new SqlDataAdapter(sql, sqlConn);
            int startRow = (currentPage - 1) * pagesize;
            sqlDa.Fill(sqlDs, startRow, pagesize, "table");
            recordcount = GetPageRecord(sql);
            closeCon();

return sqlDs;
}

        //返回總的記錄數
        public static int GetPageRecord(string sql)
        {
            openCon();
            sql = Regex.Replace(sql, "order by.*", "");
            sql = "select count(*) from (" + sql + ") as temp";
            sqlCmd = new SqlCommand(sql, sqlConn);
            int recordcount = int.Parse(sqlCmd.ExecuteScalar().ToString());
            closeCon();

return recordcount;
}

然後在BLL層新建一個PageManager.cs的分頁操作類，封裝一下DAL層方法：

Code
/**//// <summary>
        /// 獲取分頁數據
   /// </summary>
        /// <param name="sql">sql語句</param>
        /// <param name="currentPage">當前頁</param>
        /// <param name="pagesize">每頁顯示數</param>
        /// <param name="recordcount"></param>
        /// <returns></returns>
        public static DataSet GetPage(string sql, int currentPage, int pagesize, out int recordcount)
        {
            return SQLHelper.GetPage(sql, currentPage, pagesize, out recordcount);
        }

ASP.Net需分頁的數據綁定處是這樣的：

Code
<ASP:Repeater ID="repNewsList" runat="server">
    <ItemTemplate>
        <tr>
            <td align="center"><a href="list.ASPx?caid=<%# Eval("caId") %>"><%# Eval("name") %></a></td>
            <td align="center"><%# Eval("createTime") %></td>
        </tr>
    </ItemTemplate>
</ASP:Repeater>

然後在綁定代碼下方加上分頁控件(當然這個可以隨便放，怎麼好看怎麼放)：

Code

        <div >

            <webdiyer:AspNetPager ID="ASPNetPager1" runat="server" AlwaysShow="True" UrlPaging="true"
                FirstPageText="首頁" LastPageText="末頁" NextPageText="下一頁" NumericButtonCount="5"
                onpagechanged="ASPNetPager1_PageChanged" PagingButtonSpacing="10px" NumericButtonTextFormatString="[{0}]"
                PrevPageText="上一頁" SubmitButtonText="Go" TextAfterPageIndexBox="頁"
                TextBeforePageIndexBox="轉到" ShowCustomInfoSection="Left"
                CustomInfoHtml="目前是第%CurrentPageIndex%頁 / 總共%PageCount%頁">
            </webdiyer:ASPNetPager>
     
        </div>

最後在ASPx.cs中加上數據的分頁綁定方法（這裡的SQL語句要根據列表顯示的需要進行調整）：

Code
/**//// <summary>
    /// 綁定帶有分頁的新聞列表
    /// </summary>
    public void BindRepeater()
    {
        int caid = int.Parse(Request.QueryString["caid"]);

        string Sql = "select * from news where caId=" + caid + " order by createTime desc";
        int CurrentPage = ASPNetPager1.CurrentPageIndex;
        int PageSize = ASPNetPager1.PageSize;
        int RecordCount;

DataSet ds = PageManager.GetPage(Sql, CurrentPage, PageSize, out RecordCount);
ASPNetPager1.RecordCount = RecordCount;

ASPNetPager1.CustomInfoHtml += " 共" + RecordCount + "條新聞</b>";

        repNewsList.DataSource = ds;
        repNewsList.DataBind();
    }

別忘了，在page_load調用一下：

protected void Page_Load(object sender, EventArgs e)
    {
        if (!Page.IsPostBack)
        {
            BindRepeater();
        }
    }

還有分頁控件的PageChanged事件裡也調用一下：

protected void ASPNetPager1_PageChanged(object sender, EventArgs e)
    {
        BindRepeater();
    }

最後再補充一個非常漂亮的翻頁樣式，清爽超酷型~：

Code
<style>

    .anpager
    {}{
        font-size:12px;
    }
    .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;
      &n
bsp; 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;
    }