ASP.NET MVC4 HtmlHelper擴展類,實現(xiàn)分頁功能
1、擴展HtmlHelper類方法ShowPageNavigate
public static HtmlString ShowPageNavigate(this HtmlHelper htmlHelper, int currentPage, int pageSize, int totalCount) { var redirectTo = htmlHelper.ViewContext.RequestContext.HttpContext.Request.Url.AbsolutePath; pageSize = pageSize == 0 ? 3 : pageSize; var totalPages = Math.Max((totalCount + pageSize - 1) / pageSize, 1); //總頁數(shù) var output = new StringBuilder(); if (totalPages > 1) { output.AppendFormat("<a class='pageLink' href='{0}?pageIndex=1&pageSize={1}'>首頁</a> ", redirectTo, pageSize); if (currentPage > 1) {//處理上一頁的連接 output.AppendFormat("<a class='pageLink' href='{0}?pageIndex={1}&pageSize={2}'>上一頁</a> ", redirectTo, currentPage - 1, pageSize); } output.Append(" "); int currint = 5; for (int i = 0; i <= 10; i++) {//一共最多顯示10個頁碼,前面5個,后面5個 if ((currentPage + i - currint) >= 1 && (currentPage + i - currint) <= totalPages) { if (currint == i) {//當前頁處理 output.AppendFormat("<a class='cpb' href='{0}?pageIndex={1}&pageSize={2}'>{3}</a> ", redirectTo, currentPage, pageSize, currentPage); } else {//一般頁處理 output.AppendFormat("<a class='pageLink' href='{0}?pageIndex={1}&pageSize={2}'>{3}</a> ", redirectTo, currentPage + i - currint, pageSize, currentPage + i - currint); } } output.Append(" "); } if (currentPage < totalPages) {//處理下一頁的鏈接 output.AppendFormat("<a class='pageLink' href='{0}?pageIndex={1}&pageSize={2}'>下一頁</a> ", redirectTo, currentPage + 1, pageSize); } output.Append(" "); if (currentPage != totalPages) { output.AppendFormat("<a class='pageLink' href='{0}?pageIndex={1}&pageSize={2}'>末頁</a> ", redirectTo, totalPages, pageSize); } output.Append(" "); } output.AppendFormat("<label>第{0}頁 / 共{1}頁</label>", currentPage, totalPages);//這個統(tǒng)計加不加都行 return new HtmlString(output.ToString()); }
2、添加公共類PagerInfo,PageQuery
public class PagerInfo { public int RecordCount { get; set; } public int CurrentPageIndex { get; set; } public int PageSize { get; set; } } public class PagerQuery<TPager, TEntityList> { public PagerQuery(TPager pager, TEntityList entityList) { this.Pager = pager; this.EntityList = entityList; } public TPager Pager { get; set; } public TEntityList EntityList { get; set; } }
3、然后在Controller里面添加Action
public ActionResult Index(int? pageSize, int? pageIndex) { int pageIndex1 = pageIndex ?? 1; int pageSize1 = pageSize ?? 5; int count = 0; //從數(shù)據(jù)庫在取得數(shù)據(jù),并返回總記錄數(shù) var temp = newsSer.LoadPageEntities(c => true, c => c.id, false, pageSize1, pageIndex1, out count); PagerInfo pager = new PagerInfo(); pager.CurrentPageIndex = pageIndex1; pager.PageSize = pageSize1; pager.RecordCount = count; PagerQuery<PagerInfo, IQueryable<news>> query = new PagerQuery<PagerInfo, IQueryable<news>>(pager, temp); return View(query); }
4、View里的部分代碼
<tbody> @foreach (var item in Model.EntityList) { <tr> <td class="checkBox"> <input name="ids[]" type="checkbox" value="" /> </td> <td> @item.author </td> <td> @item.title </td> <td> @item.ctime </td> <td> @Html.ActionLink("編輯", "Edit", new { id = item.id }) | @Html.ActionLink("刪除", "Delete", new { id = item.id }) </td> </tr> } @*分頁*@ <tr class=""> <td colspan="5" align="center" class="paginator"> <span> @Html.ShowPageNavigate(Model.Pager.CurrentPageIndex, Model.Pager.PageSize, Model.Pager.RecordCount) </span> </td> </tr> </tbody>
5、添加一些樣式
.paginator { font: 12px Arial, Helvetica, sans-serif; padding: 10px 20px 10px 0; margin: 0px auto; } .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; } .paginator label { display:block; float:left; }
6.總結(jié)
這個案例簡單實現(xiàn)了在MVC中快速分頁,其實很多開源的項目中都有相關(guān)的HtmlHepler的擴展函數(shù),其中也不乏帶有分頁的擴展,例如著名的開源商城項目nopCommerce,其中有就一個HtmlExtensions.cs擴展類,里面就有關(guān)于分頁的擴展,人家寫的可是相當專業(yè)哦,有興趣的可以研究一下。
- ASP.NET MVC 5使用X.PagedList.Mvc進行分頁教程(PagedList.Mvc)
- MVC+jQuery.Ajax異步實現(xiàn)增刪改查和分頁
- MVC分頁之MvcPager使用詳解
- ASP.NET MVC分頁的實現(xiàn)方法
- ASP.NET MVC分頁和排序功能實現(xiàn)
- ASP.NET MVC5 實現(xiàn)分頁查詢的示例代碼
- Asp.net MVC 中利用jquery datatables 實現(xiàn)數(shù)據(jù)分頁顯示功能
- ASP.NET MVC4 Razor模板簡易分頁效果
- ASP.NET MVC+EF在服務(wù)端分頁使用jqGrid以及jquery Datatables的注意事項
- MVC使用MvcPager實現(xiàn)分頁效果
相關(guān)文章
Asp.net后臺把腳本樣式輸出到head標簽中節(jié)省代碼冗余
最近在學習開發(fā)服務(wù)器控件,其它就少不了為控件注冊js和css之類的資源文件,或者直接注冊純腳本樣式。其中就遇到如下問題 1、 注冊的資源文件或純腳本樣式在生成的頁面中都不在head標簽中(當然這個不影響頁面功能) 2、 一個頁面使用多個一樣的控件時,會出現(xiàn)重復輸入(出現(xiàn)多余代碼)2013-02-02ASP.NET MVC使用RazorEngine解析模板生成靜態(tài)頁
這篇文章主要介紹了ASP.NET MVC使用RazorEngine解析模板生成靜態(tài)頁的相關(guān)資料,需要的朋友可以參考下2016-05-05異步 HttpContext.Current實現(xiàn)取值的方法(解決異步Application,Session,Cache.
在一個項目中,為了系統(tǒng)執(zhí)行效率更快,把一個經(jīng)常用到的數(shù)據(jù)庫表通過dataset放到Application中,發(fā)現(xiàn)在異步實現(xiàn)中每一次都會出現(xiàn)HttpContext.Current為null的異常,后來在網(wǎng)上查了好多資料,發(fā)現(xiàn)問這個問題的人多,回答的少2009-07-07ASP.net WebAPI跨域調(diào)用問題的解決方法
在做Web開發(fā)中,常常會遇到跨域的問題,到目前為止,已經(jīng)有非常多的跨域解決方案。下面這篇文章主要給大家介紹了關(guān)于ASP.net WebAPI跨域調(diào)用問題的解決方法,文中通過示例代碼介紹的非常詳細,需要的朋友可以參考下。2018-03-03[譯]ASP.NET Core 2.0 網(wǎng)址重定向的方法
本篇文章主要介紹了[譯]ASP.NET Core 2.0 網(wǎng)址重定向的方法,小編覺得挺不錯的,現(xiàn)在分享給大家,也給大家做個參考。一起跟隨小編過來看看吧2017-10-10未能加載文件或程序集“AspNetPager”或它的某一個依賴項。拒絕訪問
突然間,訪問站點所有頁面都出錯,全提示:未能加載文件或程序集“AspNetPager”或它的某一個依賴項。拒絕訪問2012-06-06