1. 程式人生 > >ASP.NET 一個非常簡單實用的分頁方法

ASP.NET 一個非常簡單實用的分頁方法

分頁,也是一個非常常見得需求,以前也用過很多的分頁控制元件,現在自己參照之前用過的,自己總結一個非常簡單實用的分頁實現方法。具體如下:資料展示用Repeater,分頁的話用js切換當前的頁碼,後臺根據當前頁碼獲取資料繫結到Repeater。

資料列表程式碼

<div class="js_celli list">
    <div class="idea_cell_wh" style="overflow: visible">
        <table class="table table-striped table-hover">
            <asp:Repeater
ID="SDRepeater" runat="server">
<HeaderTemplate> <tr class="tips_title"> <th>主題</th> <th width="10%">處理狀態</th> <th width="10%">發帖人</th> <th
width="10%">
時間</th> </tr> </HeaderTemplate> <ItemTemplate> <tr> <td class="titletd" title="<%#Eval("Title") %>"><%#Eval("Title") %></td> <td
>
<%#Eval("Status")+"" == "" ? "未分派" : Eval("Status") %></td> <td><%#Eval("Author") %></td> <td><%#DateTime.Parse( Eval("Created")+"").ToString("yyyy-MM-dd hh:mm") %></td> </tr> </ItemTemplate> </asp:Repeater> </table> </div> <div style="width: 100%; text-align: center;font-size:18px;color:#ffd800;font-weight:600;" ID="lbMessage" runat="server"> </div> </div>

分頁HTML

<div class="container" style="text-align: center;">
    <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12" style="margin: 0;">
        <ul id="PagerID" class="pagination pagination-sm">
            <li><a onclick="TurnPage('f')">首頁 </a></li>
            <li><a onclick="TurnPage('p')">上頁 </a></li>
            <li>
                <span>頁:
                                    <asp:Label ID="lbCurrentPage" runat="server">0</asp:Label>/<asp:Label ID="lbMaxPage" runat="server">0</asp:Label>
                </span>
            </li>
            <li><a onclick="TurnPage('n')">下頁 </a></li>
            <li><a onclick="TurnPage('e')">末頁 </a></li>
            <li><a onclick="TurnPage('a')">GoTo </a></li>
            <li>
                <input type="text" id="txtInputNumber" style="width: 50px;"></li>
        </ul>
    </div>
</div>

分頁JS

    function TurnPage(type) {
        var currentPage = getQueryString("currentPage") == null ? 1 : parseInt(getQueryString("currentPage"));
        var maxPage = <%=maxPage%>;

        switch (type) {
            case 'f':
                currentPage = 1;
                break;
            case 'p':
                if (currentPage <= 1) {
                    return;
                }
                else {
                    currentPage = currentPage - 1;
                }
                break;
            case 'n':
                if (currentPage >= maxPage) {
                    return;
                }
                else {
                    currentPage = currentPage + 1;
                }
                break;
            case 'e':
                if(currentPage == maxPage)return;
                currentPage = maxPage;
                break;
            case 'a':
                if ( isNaN(parseInt(document.getElementById("txtInputNumber").value))) {
                    return;
                } else if (parseInt(document.getElementById("txtInputNumber").value) > maxPage) {
                    alert("沒有那麼多頁");
                    return;
                } else {
                    currentPage = parseInt(document.getElementById("txtInputNumber").value);
                }
                break;
            default:
                break;
        }

        if(!isNaN(currentPage) && currentPage > 0)
        {
            location.href = "?currentPage=" + currentPage;
        }
    }

分頁樣式

ul.pagination {
    display: inline-block;
}

.pagerlist {
    float: left;
    margin-left: 40%;
}

.pagination {
    display: inline-block;
    padding-left: 0;
    margin: 20px 0;
    border-radius: 4px;
}

.pagination {
    display: inline-block;
    padding-left: 0;
    margin: 20px 0;
    border-radius: 4px;
}

ul.pagination li {
    float: left;
    margin-right: 5px;
    border: #e2e2e2 1px solid;
}

.pagination > li {
    display: inline;
    cursor: pointer;
}

    .pagination > li:first-child > a, .pagination > li:first-child > span {
        margin-left: 0;
        border-top-left-radius: 4px;
        border-bottom-left-radius: 4px;
    }

ul.pagination li a, ul.pagination li a:link, ul.pagination li a:visited {
    display: block;
    padding: 0 10px;
    line-height: 24px;
    color: #666;
    font-size: 12px;
    text-decoration: none;
}

.pagination > li > a, .pagination > li > span {
    position: relative;
    float: left;
    padding: 2px 12px;
    margin-left: -1px;
    line-height: 1.42857143;
    color: #428bca;
    text-decoration: none;
    background-color: #fff;
    border: 1px solid #ddd;
}

後臺程式碼

        //最大頁碼
        public int maxPage = 0;
        //頁數
        int PageSize = 50;
        public SPWeb web = null;
        public bool IsCoordinator = false;

        protected void Page_Load(object sender, EventArgs e)
        {
            web = SPContext.Current.Web;

            int currentPage = 1;
            if (int.TryParse(Request["currentPage"] + "", out currentPage))
            {
            }

            if (currentPage < 1) currentPage = 1;

            DataTable dt = GetSDData();
            if (dt != null && dt.Rows.Count > 0)
            {
                lbMessage.Disabled = false;
                maxPage = (int)Math.Ceiling(dt.Rows.Count / (double)PageSize);

                lbCurrentPage.Text = currentPage + "";
                lbMaxPage.Text = maxPage + "";

                SDRepeater.DataSource = Common.GetPagedTable(dt, currentPage, PageSize);
                SDRepeater.DataBind();
            }
            else
            {
                lbMessage.Disabled = true;
                lbMessage.InnerText = " ----- no data ----- ";
            }

        }

獲取當前頁的資料

        /// <summary>
        /// DataTable分頁
        /// </summary>
        /// <param name="dt">DataTable</param>
        /// <param name="PageIndex">PageIndex表示第幾頁</param>
        /// <param name="PageSize">PageSize表示每頁的記錄數</param>
        /// <returns></returns>
        public static DataTable GetPagedTable(DataTable dt, int PageIndex, int PageSize)
        {
            DataTable newdt = dt.Copy();
            newdt.Clear();

            int rowbegin = (PageIndex - 1) * PageSize;
            int rowend = PageIndex * PageSize;

            if (rowbegin >= dt.Rows.Count)
                return newdt;

            if (rowend > dt.Rows.Count)
                rowend = dt.Rows.Count;
            for (int i = rowbegin; i <= rowend - 1; i++)
            {
                DataRow newdr = newdt.NewRow();
                DataRow dr = dt.Rows[i];
                foreach (DataColumn column in dt.Columns)
                {
                    newdr[column.ColumnName] = dr[column.ColumnName];
                }
                newdt.Rows.Add(newdr);
            }
            return newdt;
        }