首页 > 编程 > .NET > 正文

ASP.NET MVC4 HtmlHelper扩展类,实现分页功能

2024-07-10 13:30:05
字体:
来源:转载
供稿:网友
本文主要做了一个HtmHelper类的分页扩展函数,方便在视图中调用,有需要的朋友可以参考一下,希望对大家有所帮助。
 

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;  }

6.总结

这个案例简单实现了在MVC中快速分页,其实很多开源的项目中都有相关的HtmlHepler的扩展函数,其中也不乏带有分页的扩展,例如著名的开源商城项目nopCommerce,其中有就一个HtmlExtensions.cs扩展类,里面就有关于分页的扩展,人家写的可是相当专业哦,有兴趣的可以研究一下。



发表评论 共有条评论
用户名: 密码:
验证码: 匿名发表