HTML動態分頁函式

public class PageBarHelper{
        /// <summary>
        /// 動態分頁函式
        /// </summary>
        /// <param name="pageIndex">總頁數</param>
        /// <param name="pagecount">當前頁碼</param>
        /// <returns></returns>
        public static string GetpageBar(int pageIndex, int pagecount)
        {
            if (pagecount == 1)
            {
                return string.Empty;
            }
            int start = pageIndex - 5;
            if (start < 1)
            {
                start = 1;
            }
            int end = start + 9;
            if (end > pagecount)
            {
                end = pagecount;
                start = end - 9 < 1 ? 1 : end - 9;

            }
            StringBuilder sb = new StringBuilder();
            if (pageIndex > 1)
            {

                sb.AppendFormat("<a href='?pageIndex={0}' class='myPageBar'>上一頁&nbsp;</a>", pageIndex - 1);
            }
            for (int i = start; i <= end; i++)
            {
                if (i == pageIndex)
                {
                    sb.Append(i);
                }
                else
                {
                    sb.AppendFormat("<a href='?pageIndex={0}' class='myPageBar'>{0}&nbsp;</a>", i);
                   
                }
            }
            if (pageIndex < pagecount)
            {

                sb.AppendFormat("<a href='?pageIndex={0}' class='myPageBar'>下一頁</a> &nbsp;&nbsp;&nbsp;", pageIndex + 1);
            }
            return sb.ToString();
        }
}
 

myPageBar樣式參考

 .myPageBar {
            border: solid 1px #d6d6d6;
            border-radius: 0.2rem;
            color: #7d7d7d;
            text-decoration: none;
            text-transform: uppercase;
            display: inline-block;
            text-align: center;
            padding: 0.18rem 0.36rem;
        }
 

案例應用：

 <span> @MvcHtmlString.Create(PageBarHelper.GetpageBar((int)ViewData["pageIndex"], (int)ViewData["pagecount"]))</span>
 
<span class="txt">第&nbsp;<input type="text" onkeypress="PageNumber()"  id="pageinput" [email protected]["pageIndex"] style="width:30px" class="input-text radius size-S" >&nbsp;頁&nbsp;&nbsp;</span>

 <span class="txt">共 @ViewData["pagecount"] 頁</span>
 

注：來自某IT培訓班，可新增引數，動態篩選後分頁效果