本系列目录:ASP.NET MVC4入门到精通系列目录汇总

说起分页,这基本上是我们Web开发中遇见得最多的场景,没有之一,可即便如此,要做出比较优雅的分页还是需要技巧的。这里我先说一种ASP.NET MVC中很常见的一种分页的实现方式,很low,但是很多公司的项目就是这么用的,我现在公司的项目就是也是,有时候面对公司项目屎一样的用户体验和杂乱的代码,真是恨不能重写,可是往往又眼睁睁的看着它继续在运行,继续摧残着客户,又无能为力,有时候甚至为了赶进度,还被迫强奸式的复制原有的代码。

方式一:自定义Html扩展方法

效果如下:

1、新建接口IPageOfList

    public interface IPageOfList
{
long CurrentStart { get; }
int PageIndex { get; set; }
int PageSize { get; set; }
int PageTotal { get; }
long RecordTotal { get; set; }
}

2、新建一个Html扩展方法

     public static MvcHtmlString UlPaging(this HtmlHelper helper, IPageOfList list)
{
StringBuilder sb = new StringBuilder(); if (list == null)
{
return new MvcHtmlString(sb.ToString());
} sb.AppendLine("<div class=\"fenye\">" + string.Format("<span>共 {0} 条 记录,每页 {1} 条 &nbsp;</span>", list.RecordTotal, list.PageSize)); //sb.AppendLine(" <ul class=\"pagination\">");
System.Web.Routing.RouteValueDictionary route = new System.Web.Routing.RouteValueDictionary();
foreach (var key in helper.ViewContext.RouteData.Values.Keys)
{
route[key] = helper.ViewContext.RouteData.Values[key];
} foreach (string key in helper.ViewContext.RequestContext.HttpContext.Request.QueryString)
{
route[key] = helper.ViewContext.RequestContext.HttpContext.Request.QueryString[key];
} if (list.PageIndex <= 0)
{
sb.AppendLine("<a class=\"backpage\" href=\"javascript:void(0);\">上一页</a>");
}
else
{
route["pageIndex"] = list.PageIndex - 1;
//sb.AppendLine(" <li class=\"prev " + (list.PageIndex == 0 ? "disabled" : "") + "\">" + helper.ActionLink("← 上一页", route["action"].ToString(), route).ToHtmlString() + "</li>");
sb.AppendLine(helper.ActionLink("上一页", route["action"].ToString(), route).ToHtmlString());
} if (list.PageIndex > 3)
{
route["pageIndex"] = 0;
sb.AppendLine(helper.ActionLink(@"<b>1</b>", route["action"].ToString(), route).ToHtmlString().Replace("&lt;", "<").Replace("&gt;", ">"));
//sb.AppendLine(" <li>" + helper.ActionLink("1", route["action"].ToString(), route).ToHtmlString() + "</li>");
if (list.PageIndex >= 5)
{
sb.AppendLine("<a href='#'>..</a>");
}
} for (int i = list.PageIndex - 2; i <= list.PageIndex; i++)
{
if (i < 1)
continue;
route["pageIndex"] = i - 1;
//sb.AppendLine("<li" + (i == list.PageIndex + 1 ? " class=\"active\"" : "") + ">" + helper.ActionLink(i.ToString(), route["action"].ToString(), route).ToHtmlString() + "</li>");
sb.AppendLine(helper.ActionLink(@"<b>" + i.ToString() + @"</b>", route["action"].ToString(), route).ToHtmlString().Replace("&lt;", "<").Replace("&gt;", ">"));
} sb.AppendLine(@"<a class='active' href='#'><b>" + (list.PageIndex + 1) + @"</b></a>");
for (var i = list.PageIndex + 2; i <= list.PageIndex + 4; i++)
{
if (i > list.PageTotal)
continue;
route["pageIndex"] = i - 1;
sb.AppendLine(helper.ActionLink(@"<b>" + i.ToString() + @"</b>", route["action"].ToString(), route).ToHtmlString().Replace("&lt;", "<").Replace("&gt;", ">"));
//sb.AppendLine("<li" + (i == list.PageIndex + 1 ? " class=\"active\"" : "") + ">" + helper.ActionLink(i.ToString(), route["action"].ToString(), route).ToHtmlString() + "</li>");
} if (list.PageIndex < list.PageTotal - 4)
{
if (list.PageIndex <= list.PageTotal - 6)
{
sb.AppendLine("<a href='#'>..</a>");
}
route["pageIndex"] = list.PageTotal - 1; sb.AppendLine(helper.ActionLink(@"<b>" + list.PageTotal.ToString() + "</b>", route["action"].ToString(), route).ToHtmlString().Replace("&lt;", "<").Replace("&gt;", ">"));
//sb.AppendLine(" <li>" + helper.ActionLink(list.PageTotal.ToString(), route["action"].ToString(), route).ToHtmlString() + "</li>");
}
if (list.PageIndex < list.PageTotal - 1)
{
route["pageIndex"] = list.PageIndex + 1;
sb.AppendLine(helper.ActionLink("下一页", route["action"].ToString(), route).ToHtmlString());
//sb.AppendLine("<li class=\"next\">" + helper.ActionLink("下一页 →", route["action"].ToString(), route).ToHtmlString() + "</li>");, new { @class = "nextpage" }
}
else
{
sb.AppendLine("<a class=\"nextpage\" href=\"javascript:void(0);\">下一页</a>");
//sb.AppendLine("<li class=\"nextpage disabled\"><a href=\"javascript:void(0);\">下一页 →</a></li>");
}
sb.AppendLine("</div>");
return new MvcHtmlString(sb.ToString());
}

3、界面调用

@model ProjectBase.Utils.Entities.PageOfList<Uuch.MSD.Core.Orders.Order>

@Uuch.MSD.App_Start.WebHtmlHelper.UlPaging(this.Html, Model)

为什么说这代码屎一样的?

界面看上去还行对吧,其实你看那个“...”点击了是没反应的,即便到了最后一页,那个“下一页”按钮也还是显示的,还有,没有跳转到指定页的功能,当然,这些都可以自己再扩展,但是我就纳闷了,有必要每一个零件都自己重新开发吗?我们做软件开发的,其实就像工厂里做组装的,把现成的零部件按照图纸拼起来就可以了,完全不需要每一个零部件重新做。

1、用户体验极差,每次点击下一页,整个界面刷新。

2、扩展性极差,各种硬编码

3、功能很弱

方式二:第三方UI组件

用过第三方UI控件的都知道,咱们作为Web后台开发人员,可以节省许多调整样式和用原生js或者jquery实现一些功能的时间,也基本上用不着去考虑各种蛋疼的兼容性问题,因为这些问题,UI组件都替我们实现了。诸如ExtJs,easyUI,MiniUI,bootstrapts等等。

大家可以看下我之前写的ASP.NET MVC搭建项目后台UI框架—6、客户管理(添加、修改、查询、分页) 在这里我使用的是基于jquery的dataTables来实现的。

和方式一比较的优点在于

1、用户体验好,都是Ajax局部刷新的,而且可以支持一次性读取所有,然后在内存中分页(对于数据量不大的表而言,这样的分页效率很高),其次支持服务器分页。

2、扩展性好,界面的样式和显示都是可以通过属性来配置的,基本上不存在所谓的硬编码。

3、功能强大

大家有什么好的想法,说出来大家一起探讨下吧!

在以前,没有使用ORM框架,使用ADO.Net的年代,我们通常分页都是写分页存储过程来实现分页的,但是随着ORM框架的风行,分页变得越来越简单。

看着那些屎一样的项目,无论点个啥东西都把整个界面刷新,而我又不得不天天用,弄得眼睛都被闪瞎了,可是又无能为力,真心很痛苦,都说前人挖坑后人填,可是有些时候,前人坑挖得后面的人没时间填。不由得想起一个客户说的话:“公司系统有点烂,体验比较差,快递有点慢,客服比较拽,售后有点差,运费比较高”。

11、ASP.NET MVC入门到精通——AspnetMVC分页的更多相关文章

  1. 25、ASP.NET MVC入门到精通——Spring.net-业务层仓储

    本系列目录:ASP.NET MVC4入门到精通系列目录汇总 上一节,我们已经把项目框架的雏形搭建好了,那么现在我来开始业务实现,在业务实现的过程当中,不断的来完善我们现有的框架. 1.假设我们来做一个 ...

  2. 26、ASP.NET MVC入门到精通——后台管理区域及分离、Js压缩、css、jquery扩展

    本系列目录:ASP.NET MVC4入门到精通系列目录汇总 有好一段时间没更新博文了,最近在忙两件事:1.看书,学习中...2.为公司年会节目做准备,由于许久没有练习双截棍了,难免生疏,所以现在临时抱 ...

  3. 13、ASP.NET MVC入门到精通——MVC请求管道

    本系列目录:ASP.NET MVC4入门到精通系列目录汇总 ASP.NET MVC的请求管道和ASP.NET请求管道基本上一模一样,如果你对ASP.NET请求管道十分熟悉的话,你只要关注一下不同点.看 ...

  4. 20、ASP.NET MVC入门到精通——WebAPI

    本系列目录:ASP.NET MVC4入门到精通系列目录汇总 微软有了Webservice和WCF,为什么还要有WebAPI? 用过WCF的人应该都清楚,面对那一大堆复杂的配置文件,有时候一出问题,真的 ...

  5. 22、ASP.NET MVC入门到精通——搭建项目框架

    本系列目录:ASP.NET MVC4入门到精通系列目录汇总 前面的章节,说了ASP.NET MVC项目中常用的一些技术和知识点,更多的是理论上面的东西,接下来,我将通过一个简单的OA项目来应用我们之前 ...

  6. 24、ASP.NET MVC入门到精通——数据库仓储

    本系列目录:ASP.NET MVC4入门到精通系列目录汇总 业务层调用数据层对象,我不想每次都new一个数据层对象,而是在数据层创建一个仓储,统一管理所有的对象调用. 1.在IDAL项目中,新建IDB ...

  7. ASP.NET MVC入门到精通——MVC请求管道

    https://www.cnblogs.com/jiekzou/p/4896315.html 本系列目录:ASP.NET MVC4入门到精通系列目录汇总 ASP.NET MVC的请求管道和ASP.NE ...

  8. 1、ASP.NET MVC入门到精通——新语法

    本系列目录:ASP.NET MVC4入门到精通系列目录汇总 在学习ASP.NET MVC之前,有必要先了解一下C#3.0所带来的新的语法特性,这一点尤为重要,因为在MVC项目中我们利用C#3.0的新特 ...

  9. 5、ASP.NET MVC入门到精通——NHibernate代码映射

    本系列目录:ASP.NET MVC4入门到精通系列目录汇总 上一篇NHibernate学习笔记—使用 NHibernate构建一个ASP.NET MVC应用程序 使用的是xml进行orm映射,那么这一 ...

随机推荐

  1. TODO:Ubuntu下安装Node

    TODO:Ubuntu下安装Node Node.js 是一个基于 Chrome V8 引擎的 JavaScript 运行环境.Node.js 使用了一个事件驱动.非阻塞式 I/O 的模型,使其轻量又高 ...

  2. 《Entity Framework 6 Recipes》中文翻译系列 (39) ------ 第七章 使用对象服务之配置模型和使用单复数服务

    翻译的初衷以及为什么选择<Entity Framework 6 Recipes>来学习,请看本系列开篇 7-3  配置模型 问题 你想了解配置模型中的各种选项. 解决方案 当你添加一个AD ...

  3. C#设计模式-外观模式

    在软件开发过程中,客户端程序经常会与复杂系统的内部子系统进行耦合,从而导致客户端程序随着子系统的变化而变化,然而为了将复杂系统的内部子系统与客户端之间的依赖解耦,从而就有了外观模式,也称作 ”门面“模 ...

  4. angularjs中provider,factory,service的区别和用法

    angularjs中provider,factory,service的区别和用法 都能提供service,但是又有差别 service 第一次被注入时实例化,只实例化一次,整个应用的生命周期中是个单例 ...

  5. WPF如何仿制QQ2013登录窗口的关闭效果

    昨天,有位朋友问我,WPF能做出像QQ2013窗口在关闭时那个貌似透明过渡的动画吗?我就歪着脸跟他说:"只有你想不到的,没有WPF做不到的". 他又接着说:"我知道肯定会 ...

  6. OpenCASCADE Curve Length Calculation

    OpenCASCADE Curve Length Calculation eryar@163.com Abstract. The natural parametric equations of a c ...

  7. WPF绘制折线

    WPF后台绘制折线,填充到一个GRID下 private void btnPreview_Click(object sender, RoutedEventArgs e) { GridImg.Child ...

  8. 【彩票】彩票预测算法(一):离散型马尔可夫链模型C#实现

    前言:彩票是一个坑,千万不要往里面跳.任何预测彩票的方法都不可能100%,都只能说比你盲目去买要多那么一些机会而已. 已经3个月没写博客了,因为业余时间一直在研究彩票,发现还是有很多乐趣,偶尔买买,娱 ...

  9. 【原创】开源Math.NET基础数学类库使用(11)C#计算相关系数

                   本博客所有文章分类的总目录:[总目录]本博客博文总目录-实时更新  开源Math.NET基础数学类库使用总目录:[目录]开源Math.NET基础数学类库使用总目录 前言 ...

  10. 数据可视化-EChart2.0.0使用中遇到的2个问题

    之前项目中都是使用FusionChart和HighChart,基本都是没有购买商业许可.然后现在开发的系统需要交付给客户使用.所以现在图表控件不能直接使用FusionChart和HighChart,通 ...