Asp.net mvc项目分页功能

1.定义一个分页用的Page<T>类

 /* 使用示例：
      var pager = new Pager<Article>(
                 this.ControllerContext, //上下文
                 type.Articles,//数据源
                 10//,每页大小
                 //"page" url中分页参数名称，默认为page
                 );
      * */
     /// <summary>
     /// 基于ControlerContext的分页辅助类
     /// </summary>
     /// <typeparam name="T"></typeparam>

     public class Pager<T>
     {
         /// <summary>
         /// 数据分页初始化函数
         /// </summary>
         /// <param name="context">控制器请求上下文</param>
         /// <param name="source">数据源</param>
         /// <param name="pageSize">每页条数</param>
         /// <param name="currentPageurlParamName">Url中当前页参数名称</param>
         public Pager(
             ControllerContext context,
             IEnumerable<T> source,
             int pageSize = ,
             string currentPageurlParamName = "page")
         {

             this.PageSize = pageSize;
             this.CurrentPageUrlParamName = currentPageurlParamName;

             this.TotalItmesCount = source.Count();
             var page = ;
             int.TryParse(context.HttpContext.Request.Params[CurrentPageUrlParamName], out page);
             this.CurrentPage = page;

             this.data = source.Skip((CurrentPage - ) * PageSize)
                              .Take(PageSize);

             this.PageNavProvider = new PagerNavProvider<T>(this);
         }
         /// <summary>
         /// URL中 页码参数名称
         /// </summary>
         public string CurrentPageUrlParamName
         {
             get;
             private set;
         }
         private int currentPage;
         /// <summary>
         /// 当前页码，从1开始
         /// </summary>
         public int CurrentPage
         {
             get { return currentPage; }
             private set
             {
                 if (value > TotalPage)
                     currentPage = TotalPage;
                 else if (value <= )
                     currentPage = ;
                 else
                     currentPage = value;
             }
         }
         /// <summary>
         /// 用于分页的数据总数
         /// </summary>
         public int TotalItmesCount
         {
             get;
             private set;
         }
         /// <summary>
         /// 每页包含的数据总数，默认为10条
         /// </summary>
         public int PageSize
         {
             get;
             private set;
         }
         /// <summary>
         /// 最大页码，即总页数
         /// </summary>
         public int TotalPage
         {
             get
             {
                 return (TotalItmesCount / PageSize) + (TotalItmesCount % PageSize >  ?  : );
             }
         }
         /// <summary>
         /// 是否有上一页
         /// </summary>
         public bool HasPrev
         {
             get
             {
                 return CurrentPage > ;
             }
         }
         /// <summary>
         /// 是否有下一页
         /// </summary>
         public bool HasNext
         {
             get
             {
                 return CurrentPage < TotalPage;
             }
         }
         /// <summary>
         /// 上一页页码
         /// </summary>
         public int PrevPage
         {
             get
             {
                 if (HasPrev)
                     return CurrentPage - ;
                 else
                     throw new Exception("已经是第一页了！");
             }
         }
         /// <summary>
         /// 下一页页码
         /// </summary>
         public int NextPage
         {
             get
             {
                 if (HasNext)
                     return CurrentPage + ;
                 else
                     throw new Exception("已经是最后一页了！");
             }
         }
         private IEnumerable<T> data;
         /// <summary>
         /// 当前页包含的数据
         /// </summary>
         public IEnumerable<T> CurrentPageItems
         {
             get { return data; }
         }

         public PagerNavProvider<T> PageNavProvider { get; private set; }
     }

     public class PagerNavProvider<T>
     {

         public PagerNavProvider(Pager<T> pager, int dispalyPage = )
         {
             DisplayPage = dispalyPage;
             var cur = pager.CurrentPage;
             StartPageNum = cur - pager.PageSize / ;
             EndPageNum = cur + pager.PageSize / ;
             if (StartPageNum <=  || pager.TotalPage < DisplayPage)
                 StartPageNum = ;
             if (EndPageNum >= pager.TotalPage || pager.TotalPage < DisplayPage)
                 EndPageNum = pager.TotalPage;
         }
         public int DisplayPage { get; private set; }
         public int StartPageNum { get; private set; }
         public int EndPageNum { get; private set; }
     }

2.定义一个要展示列表数据的视图模型(根据具体情况定义模型属性)

 public class ServiceListVModel
     {

         public IEnumerable<Service> Services { get; set; }

         public Pager<Service> Pager { get; set; }

     }

3.在控制器中为视图模型赋值传递数据

  public ActionResult List(string code = "")
         {
             var services = dbSession.ServiceRepository.LoadEntities(p=>p.Type.StartsWith(code));
             var model = new ServiceListVModel();
             model.Services = services;
             var pager = new Pager<Service>(
                 this.ControllerContext,
                 services,
                 );
             model.Pager = pager;
             ViewBag.ServiceTypeCode = code;
             return View(model);
         }

4.前端页面数据展示(分页样式根据自己想要的效果自由替换)

 @model ServiceTrade.ViewModels.ServiceListVModel
 @{
     ViewBag.Title = "服务列表";
     Layout = "~/Views/Shared/_Layout.cshtml";
 }
 <div class="centerMain goldMain middle clearfix" id="goldMainL">
     <div class="goldMainW">
         @Html.Action("ServiceTypeList")
         <ul class="searchResultList">
          @foreach (var item in Model.Pager.CurrentPageItems)
             {
                 <li class="searchTerms clearfix">
                     <div class="searchTermsPic">
                         <a class="searchTerPicA" href="/Service/Detail?id=@item.ID" target="_blank"
                     title="@item.Name">
                             <img alt="@item.Name" src="@item.Pic" style=" width:100px; height:100px;"></a>
                     </div>
                     <div class="searchTermsDetail">
                         <h2 class="title">
                             <a data-exposure="1,0,67167185" class="comtitle" href="/Service/Detail?id=@item.ID"
                         target="_blank" title="@item.Name">@item.Name</a>
                         </h2>
                         <div class="searchTermsDIntro">
                         <b>￥@item.Price</b>
                     </div>
                         <div class="searchTermsOper">
                             <a rel="external nofollow" class="qq" target="_blank" href="http://wpa.qq.com/msgrd?v=3&amp;uin=@item.Company.QQ&amp;site=qq&amp;menu=yes">
                                 <img border="" src="../../../Themes/FrontEnd/Images/qq.gif" alt="点击这里给我发消息" title="点击这里给我发消息"></a>
                         </div>
                     </div>
                     <div class="searchTermsC">
                         <p class="companyName">
                             <a data-exposure="1,2055823,0" href="/Company/Index?id=@item.CompanyID" target="_blank">
                                 @item.Company.Name</a>
                         </p>
                         <p class="bus-mod">
                             经营模式：@item.Company.BusinessModel</p>
                         <p class="companySell">
                             <span class="sell">主营：</span> @item.Company.MainService
                         </p>
                          <p class="relate">
                         <a href="javascript:void(0);" target="_blank">厂家地址</a>
                         | <a href="javascript:void(0);" target="_blank">更多产品</a></p>
                     </div>
                 </li>
             }
         </ul>

         <div class="pagination middle">
             @Html.Partial("_PagerNavX", Model.Pager)
             <div class="gotoPages">
             @if (Model.Services != null)
             {
                 <span>共 @Model.Services.Count()页</span>
             }
             else
             {
                 <span>共0页</span>
             }
             </div>
         </div>
     </div>
 </div>

5.分页模块视图代码(_PagerNavX.cshtml)

 @model Huazeming.Common.Mvc.Pager<SimpleNews.DAL.Service>
 @{
     var start = Model.PageNavProvider.StartPageNum;
     var end = Model.PageNavProvider.EndPageNum;
     var cur = Model.CurrentPage;
     //var type = Model.CurrentPageItems.First().Type;
     var typeCode = ViewBag.ServiceTypeCode;
 }
 <div class="pages">
     @if (Model.HasPrev)
     {

         <a href="/Service/List?page=@Model.PrevPage&code=@typeCode">上一页</a>

     }
     else
     {
         <span class="noChangePage">上一页</span>
     }
     @for (var i = start; i <= end; i++)
     {
         if (i == cur)
         {
         <a class="current" href="javascript:;">@cur</a>

         }
         else
         {
         <a href="/Service/List?page=@i&code=@typeCode" rel="external nofollow">@i</a>
         }
     }
     @if (Model.HasNext)
     {
         <a href="/Service/List?page=@Model.NextPage&code=@typeCode">下一页</a>
     }
     else
     {
         <span class="noChangePage">下一页</span>
     }
 </div>

6.分页部分CSS样式

 /*pagination*/
 .pagination{width: %;overflow:hidden;text-align: center;}
 .pagination .pages{vertical-align: middle;display: inline-block;text-align: center;*display:inline; zoom:;}
 .pagination .gotoPages{display: inline-block;text-align: center;*display:inline; zoom:;}
 .pagination a,.pagination .pageBreak,.pagination .noChangePage{border: 1px #e1e1e1 solid;display:inline-block;border-right: none;height: 30px;height: 30px;line-height: 30px;padding:  11px;text-align: center;vertical-align: middle;white-space: nowrap;font-size: 14px;color: #2968aa;font-weight: ;}
 .pagination .pages a:hover,.pagination .current{background-color: #f2f2f2;color: #ff781f;text-decoration: none;}
 .pagination .pageBreak{border: none;border-left: 1px #e1e1e1 solid;font-weight: ;}
 .pagination .prevs,.pagination .noChangePage{margin-right: 4px;border: 1px #e1e1e1 solid;font-size: 12px;font-weight: ;}
 .pagination .nextPage{margin-right: 4px;border: 1px #e1e1e1 solid;font-size: 12px;font-weight: ;}
 .pagination .noChangePage{color: #;cursor: default;}
 .pagination .pageNumberI{width: 41px;padding:3px 2px;height:18px;border: 1px #e0e0e0 solid;background-color: #ffffff;margin-right: 3px;margin-left: 3px;}
 .pagination .gotoPages span{margin: 15px;}
 .pagination .gotoPagesBtn{border: none;background:none;width:58px;height:24px;border-radius: 3px;border: 1px solid #b3b3b3;background-color: #f5f5f5;color: #;cursor: pointer;}
 /*pagination*/

7.分页最终效果图