转 ---- Asp.net mvc项目分页功能
1.定义一个分页用的Page<T>类
1 /* 使用示例：
2 var pager = new Pager<Article>(
3 this.ControllerContext, //上下文
4 type.Articles,//数据源
5 10//,每页大小
6 //"page" url中分页参数名称，默认为page
7 );
8 * */
9 /// <summary>
10 /// 基于ControlerContext的分页辅助类
11 /// </summary>
12 /// <typeparam name="T"></typeparam>
13
14 public class Pager<T>
15 {
16 /// <summary>
17 /// 数据分页初始化函数
18 /// </summary>
19 /// <param name="context">控制器请求上下文</param>
20 /// <param name="source">数据源</param>
21 /// <param name="pageSize">每页条数</param>
22 /// <param name="currentPageurlParamName">Url中当前页参数名称</param>
23 public Pager(
24 ControllerContext context,
25 IEnumerable<T> source,
26 int pageSize = 10,
27 string currentPageurlParamName = "page")
28 {
29
30 this.PageSize = pageSize;
31 this.CurrentPageUrlParamName = currentPageurlParamName;
32
33 this.TotalItmesCount = source.Count();
34 var page = 1;
35 int.TryParse(context.HttpContext.Request.Params[CurrentPageUrlParamName], out page);
36 this.CurrentPage = page;
37
38 this.data = source.Skip((CurrentPage - 1) * PageSize)
39 .Take(PageSize);
40
41 this.PageNavProvider = new PagerNavProvider<T>(this);
42 }
43 /// <summary>
44 /// URL中 页码参数名称
45 /// </summary>
46 public string CurrentPageUrlParamName
47 {
48 get;
49 private set;
50 }
51 private int currentPage;
52 /// <summary>
53 /// 当前页码，从1开始
54 /// </summary>
55 public int CurrentPage
56 {
57 get { return currentPage; }
58 private set
59 {
60 if (value > TotalPage)
61 currentPage = TotalPage;
62 else if (value <= 0)
63 currentPage = 1;
64 else
65 currentPage = value;
66 }
67 }
68 /// <summary>
69 /// 用于分页的数据总数
70 /// </summary>
71 public int TotalItmesCount
72 {
73 get;
74 private set;
75 }
76 /// <summary>
77 /// 每页包含的数据总数，默认为10条
78 /// </summary>
79 public int PageSize
80 {
81 get;
82 private set;
83 }
84 /// <summary>
85 /// 最大页码，即总页数
86 /// </summary>
87 public int TotalPage
88 {
89 get
90 {
91 return (TotalItmesCount / PageSize) + (TotalItmesCount % PageSize > 0 ? 1 : 0);
92 }
93 }
94 /// <summary>
95 /// 是否有上一页
96 /// </summary>
97 public bool HasPrev
98 {
99 get
100 {
101 return CurrentPage > 1;
102 }
103 }
104 /// <summary>
105 /// 是否有下一页
106 /// </summary>
107 public bool HasNext
108 {
109 get
110 {
111 return CurrentPage < TotalPage;
112 }
113 }
114 /// <summary>
115 /// 上一页页码
116 /// </summary>
117 public int PrevPage
118 {
119 get
120 {
121 if (HasPrev)
122 return CurrentPage - 1;
123 else
124 throw new Exception("已经是第一页了！");
125 }
126 }
127 /// <summary>
128 /// 下一页页码
129 /// </summary>
130 public int NextPage
131 {
132 get
133 {
134 if (HasNext)
135 return CurrentPage + 1;
136 else
137 throw new Exception("已经是最后一页了！");
138 }
139 }
140 private IEnumerable<T> data;
141 /// <summary>
142 /// 当前页包含的数据
143 /// </summary>
144 public IEnumerable<T> CurrentPageItems
145 {
146 get { return data; }
147 }
148
149 public PagerNavProvider<T> PageNavProvider { get; private set; }
150 }
151
152 public class PagerNavProvider<T>
153 {
154
155 public PagerNavProvider(Pager<T> pager, int dispalyPage = 10)
156 {
157 DisplayPage = dispalyPage;
158 var cur = pager.CurrentPage;
159 StartPageNum = cur - pager.PageSize / 2;
160 EndPageNum = cur + pager.PageSize / 2;
161 if (StartPageNum <= 0 || pager.TotalPage < DisplayPage)
162 StartPageNum = 1;
163 if (EndPageNum >= pager.TotalPage || pager.TotalPage < DisplayPage)
164 EndPageNum = pager.TotalPage;
165 }
166 public int DisplayPage { get; private set; }
167 public int StartPageNum { get; private set; }
168 public int EndPageNum { get; private set; }
169 }
2.定义一个要展示列表数据的视图模型(根据具体情况定义模型属性)
1 public class ServiceListVModel
2 {
3
4 public IEnumerable<Service> Services { get; set; }
5
6 public Pager<Service> Pager { get; set; }
7
8
9 }
3.在控制器中为视图模型赋值传递数据
1 public ActionResult List(string code = "11")
2 {
3 var services = dbSession.ServiceRepository.LoadEntities(p=>p.Type.StartsWith(code));
4 var model = new ServiceListVModel();
5 model.Services = services;
6 var pager = new Pager<Service>(
7 this.ControllerContext,
8 services,
9 10);
10 model.Pager = pager;
11 ViewBag.ServiceTypeCode = code;
12 return View(model);
13 }
4.前端页面数据展示(分页样式根据自己想要的效果自由替换)
1 @model ServiceTrade.ViewModels.ServiceListVModel
2 @{
3 ViewBag.Title = "服务列表";
4 Layout = "~/Views/Shared/_Layout.cshtml";
5 }
6 <div class="centerMain goldMain middle clearfix" id="goldMainL">
7 <div class="goldMainW">
8 @Html.Action("ServiceTypeList")
9 <ul class="searchResultList">
10 @foreach (var item in Model.Pager.CurrentPageItems)
11 {
12 <li class="searchTerms clearfix">
13 <div class="searchTermsPic">
14 <a class="searchTerPicA" href="/Service/Detail?id=@item.ID" target="_blank"
15 title="@item.Name">
16 <img alt="@item.Name" src="@item.Pic" style=" width:100px; height:100px;"></a>
17 </div>
18 <div class="searchTermsDetail">
19 <h2 class="title">
20 <a data-exposure="1,0,67167185" class="comtitle" href="/Service/Detail?id=@item.ID"
21 target="_blank" title="@item.Name">@item.Name</a>
22 </h2>
23 <div class="searchTermsDIntro">
24 <b>￥@item.Price</b>
25 </div>
26 <div class="searchTermsOper">
27 <a rel="external nofollow" class="qq" target="_blank" href="http://wpa.qq.com/msgrd?v=3&uin=@item.Company.QQ&site=qq&menu=yes">
28 <img border="0" src="../../../Themes/FrontEnd/Images/qq.gif" alt="点击这里给我发消息" title="点击这里给我发消息"></a>
29 </div>
30 </div>
31 <div class="searchTermsC">
32 <p class="companyName">
33 <a data-exposure="1,2055823,0" href="/Company/Index?id=@item.CompanyID" target="_blank">
34 @item.Company.Name</a>
35 </p>
36 <p class="bus-mod">
37 经营模式：@item.Company.BusinessModel</p>
38 <p class="companySell">
39 <span class="sell">主营：</span> @item.Company.MainService
40 </p>
41 <p class="relate">
42 <a href="javascript:void(0);" target="_blank">厂家地址</a>
43 | <a href="javascript:void(0);" target="_blank">更多产品</a></p>
44 </div>
45 </li>
46 }
47 </ul>
48
49 <div class="pagination middle">
50 @Html.Partial("_PagerNavX", Model.Pager)
51 <div class="gotoPages">
52 @if (Model.Services != null)
53 {
54 <span>共 @Model.Services.Count()页</span>
55 }
56 else
57 {
58 <span>共0页</span>
59 }
60 </div>
61 </div>
62 </div>
63 </div>
5.分页模块视图代码(_PagerNavX.cshtml)
1 @model Huazeming.Common.Mvc.Pager<SimpleNews.DAL.Service>
2 @{
3 var start = Model.PageNavProvider.StartPageNum;
4 var end = Model.PageNavProvider.EndPageNum;
5 var cur = Model.CurrentPage;
6 //var type = Model.CurrentPageItems.First().Type;
7 var typeCode = ViewBag.ServiceTypeCode;
8 }
9 <div class="pages">
10 @if (Model.HasPrev)
11 {
12
13 <a href="/Service/List?page=@Model.PrevPage&code=@typeCode">上一页</a>
14
15 }
16 else
17 {
18 <span class="noChangePage">上一页</span>
19 }
20 @for (var i = start; i <= end; i++)
21 {
22 if (i == cur)
23 {
24 <a class="current" href="javascript:;">@cur</a>
25
26 }
27 else
28 {
29 <a href="/Service/List?page=@i&code=@typeCode" rel="external nofollow">@i</a>
30 }
31 }
32 @if (Model.HasNext)
33 {
34 <a href="/Service/List?page=@Model.NextPage&code=@typeCode">下一页</a>
35 }
36 else
37 {
38 <span class="noChangePage">下一页</span>
39 }
40 </div>
6.分页部分CSS样式
1 /*pagination*/
2 .pagination{width: 100%;overflow:hidden;text-align: center;}
3 .pagination .pages{vertical-align: middle;display: inline-block;text-align: center;*display:inline; zoom:1;}
4 .pagination .gotoPages{display: inline-block;text-align: center;*display:inline; zoom:1;}
5 .pagination a,.pagination .pageBreak,.pagination .noChangePage{border: 1px #e1e1e1 solid;display:inline-block;border-right:0 none;height: 30px;height: 30px;line-height: 30px;padding: 0 11px;text-align: center;vertical-align: middle;white-space: nowrap;font-size: 14px;color: #2968aa;font-weight: 700;}
6 .pagination .pages a:hover,.pagination .current{color: #ff781f;text-decoration: none;}
7 .pagination .pageBreak{border:0 none;border-left: 1px #e1e1e1 solid;font-weight: 400;}
8 .pagination .prevs,.pagination .noChangePage{margin-right: 4px;border: 1px #e1e1e1 solid;font-size: 12px;font-weight: 400;}
9 .pagination .nextPage{margin-right: 4px;border: 1px #e1e1e1 solid;font-size: 12px;font-weight: 400;}
10 .pagination .noChangePage{color: #888888;cursor: default;}
11 .pagination .pageNumberI{width: 41px;padding:3px 2px;height:18px;border: 1px #e0e0e0 solid;margin-right: 3px;margin-left: 3px;}
12 .pagination .gotoPages span{margin:0 15px;}
13 .pagination .gotoPagesBtn{border:0 none;background:none;width:58px;height:24px;border-radius: 3px;border: 1px solid #b3b3b3;color: #333333;cursor: pointer;}
14 /*pagination*/
7.分页最终效果图
转 ---- Asp.net mvc项目分页功能的更多相关文章
- Asp.net mvc项目分页功能
1.定义一个分页用的Page<T>类 /* 使用示例: var pager = new Pager<Article>( this.ControllerContext, //上下 ...
- 学习ASP.NET MVC(十一)——分页
在这一篇文章中,我们将学习如何在MVC页面中实现分页的方法.分页功能是一个非常实用,常用的功能,当数据量过多的时候,必然要使用分页.在今天这篇文章中,我们学习如果在MVC页面中使用PagedList. ...
- 基于BUI开发Asp.net MVC项目
因工作性质参于并开发过一些Web应用程序,前端项目框架也用了不少,比如MiniUI.ExtJS.以及定制的项目前端框架.无意中看到BUI前端框架,第一眼就被它的优雅布局所吸引.简洁的项目门户Banne ...
- ASP.NET MVC项目实现BasePage基类用作ASPX.CS网页继承
在ASP.NET MVC项目开发,还是需要创建一些Web Page来实现一些功能,如呈现报表等... 但是一旦项目的.ASPX网页太多了,其中的程序代码也会有代码冗余,出现这些情况,我们得需要对这些代 ...
- asp.net MVC通用分页组件 使用方便 通用性强
asp.net MVC通用分页组件 使用方便 通用性强 该分页控件的显示逻辑: 1 当前页面反色突出显示,链接不可点击 2 第一页时首页链接不可点击 3 最后一页时尾页链接不可点击 4 当前页面左 ...
- AngularJS2 + ASP.NET MVC项目
环境:VS2015, NodeJS:v 6.5, npm: v3.10, AngularJs 2 通过将ASP.NET MVC项目与Angualr 2官网上的quick start整合的过程中遇到些问 ...
- 远程调试 ASP.NET MVC 项目
Visual Studio 支持从一台计算机到另一台设备的远程调试.进行远程调试时,主机可以是任何支持 Visual Studio 的平台.远程设备可以是 x86.x64 或 ARM 平台. 本文将指 ...
- 习题-任务2初始ASP.NET MVC项目开发
一.选择题 1.在ASP.NET MVC项目的RouteConfig.cs文件中,( )方法注册了默认的路由配置. A.RegisterMap B.RegisterRoutes C. ...
- Asp.net mvc项目架构分享系列之架构概览
Asp.net mvc项目架构分享系列之架构概览 Contents 系列一[架构概览] 0.项目简介 1.项目解决方案分层方案 2.所用到的技术 3.项目引用关系 系列二[架构搭建初步] 4.项目架构 ...
随机推荐
- Python实战：美女图片下载器，海量图片任你下载
Python应用现在如火如荼,应用范围很广.因其效率高开发迅速的优势,快速进入编程语言排行榜前几名.本系列文章致力于可以全面系统的介绍Python语言开发知识和相关知识总结.希望大家能够快速入门并学习 ...
- 安卓Intent(显式)
1.Intent是Android程序中各组件之间交互的重要方式,一般可用于启动活动.启动服务.以及发送广播等场景,这里先对活动进行说明Intent的一些作用. 2.Intent的用法大致可分为,显式I ...
- github上建站和使用markdown写文章
积累了那么久,终于成功搭建了github上的个人网站.虽然方法有点巧妙.不是还是建成了 同时学会用markdown写基本的文章.感觉还可以.附带我的github上的静态页面网站的网址:http://z ...
- SqlSugar-执行Sql语句查询实例
使用SqlSugar执行sql语句 1.简单查询 SqlSugarClient db = SugarContext.GetInstance(); //执行sql语句,处理 //1.执行sql,转成li ...
- (转)php连接mysql如何判断数据为空？
<?php$result_a=mysql_query("select * from product_tag where product_id=$row[id]");$num ...
- jQuery AJAX load() 方法
jQuery load() 方法 jQuery load() 方法是简单但强大的 AJAX 方法. load() 方法从服务器加载数据,并把返回的数据放入被选元素中. 语法: $(selector). ...
- python学习笔记--随时更新
# coding=GBK score = 90 if score >= 80: print("好") elif score >= 60: print("及格& ...
- mysql 刘道成视频教程 第3课
第3课: 1.mysql中条件使用关键字where: 2.查 select name,content from msg ; select name,content 控制列 where id>2 ...
- 深入了解jquery中的键盘事件
很多时候,我们需要获取用户的键盘事件,下面就一起来看看jquery是如何操作键盘事件的. 一.首先需要知道的是: 1.keydown() keydown事件会在键盘按下时触发. 2.keyup() k ...
- 关于webapp的一个webframe问题
最近重启ios webapp的项目,将之前的框架拿过来发现出现了错误,错误出现在写JSAlart控件的WebFrame上,xcode会报WebFrame是未定义的错误.由于之前使用的是ios5的 sd ...