如何在ASP.NET中使用HtmlHelper扩展类实现一个分页功能

如何在ASP.NET中使用HtmlHelper扩展类实现一个分页功能？很多新手对此不是很清楚，为了帮助大家解决这个难题，下面小编将为大家详细讲解，有这方面需求的人可以来学习下，希望你能有所收获。

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); //总页数   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);//这个统计加不加都行   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;   //从数据库在取得数据，并返回总记录数   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;   }

看完上述内容是否对您有帮助呢？如果还想对相关知识有进一步的了解或阅读更多相关文章，请关注亿速云行业资讯频道，感谢您对亿速云的支持。