自己写的一个Pager分页组件,WebForm，Mvc都适用
我一说写这个功能的时候，好多人估计有疑问。分页功能网上多的是，搜一个不就行了，你这样不是浪费时间么。你说这句话的时候，我是比较信的，首先自己写一些东西是很耗时，有这些时间又能多打几盘LOL了。但是我觉得有些东西需要你自己写了之后思路才清晰，一直认为知道一些原理才是最重要的，并且能让你更深入的去了解一门语言。就像好多人说“我精通JQuery框架”，那我想问你“有没有看过Jquery源码，知不知道它的实现原理和机制？”。熟练和精通不是同一个层次，首先熟练是你会使用一些框架的语法和用法，精通是指你知道其中的原理和机制，并且能够模仿并延伸一些知识。我说这话的意思是让大家带着一股钻研精神去学习一门语言，当做一种兴趣和爱好，而不仅仅是把它当做一个饭碗，混混日子那么简单。
说到这个功能，我不得不提一下一个叫杨涛的大叔，一个善于与别人分享资源的人,你可以称他为“分页达人”，写了各种分页的扩展，他的个人主页地址http://www.webdiyer.com/，大家没事可以看看，想必也有好多人用过他写的分页控件。
下面来说说正题，这个功能其实是我两年前写的，今天无意间看到，所以只是想和大家分享一下，另外也算是做个笔记，说下我的思路。
分页控件其实就是根据链接在页面间传递参数，因为我看到MVC中你可以看到这样传递参数的new {para=val}这种方式传递参数，于是我想到用可以模仿这种传递参数的方式，那就用dynamic来作为参数对象传递。
下面是附上我写的具体的实现的代码
数据处理代码：
1.定义IPagedList接口
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks; namespace Infrastruction.Pager
{
public interface IPagedList
{
int pageIndex { get; set; }
int pageSize { get; set; }
int totalItemCount { get; set; }
int totalPageCount { get; }
}
}
2.实现IPagedList接口
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web; namespace Infrastruction.Pager
{
public class PagedList<T> : List<T>, IPagedList
{
public int pageIndex
{
get;
set;
} public int pageSize
{
get;
set;
} public int totalItemCount
{
get;
set;
} public int totalPageCount
{
get
{
return totalItemCount % pageSize == ? (totalItemCount / pageSize) : (totalItemCount / pageSize + );
}
} public PagedList(IEnumerable<T> sources, int pageIndex, int pageSize)
{
if (sources != null && sources.Any())
{
this.AddRange(sources.Skip(pageSize * (pageIndex - )).Take(pageSize).ToList());
}
this.pageIndex = pageIndex;
this.pageSize = pageSize;
this.totalItemCount = sources.Count();
}
}
}
分页标签处理代码：
3.PagerHelper
using Infrastruction.Pager;
using System;
using System.Collections.Generic;
using System.Linq;
using System.Reflection;
using System.Text;
using System.Web;
using System.Web.UI; namespace System.Web.UI
{
public static class PagerHelper
{ public static string Pager(string url, IPagedList pagedList)
{
StringBuilder builder = new StringBuilder();
if (pagedList != null)
{
builder.Append("<script type='text/javascript'>");
builder.Append("window.onload = function () {");
builder.Append(" var elements = document.getElementById('pager').childNodes;");
builder.Append(" for (var i = 0; i < elements.length; i++) {");
builder.Append("var txt = elements[i].innerText || elements[i].textContent;");
builder.Append(" if (elements[i].nodeType =='1' && txt == '" + pagedList.pageIndex + "') {");
builder.Append("elements[i].style.textDecoration = 'underline';break; } } }");
builder.Append("</script>");
builder.Append("<div id='pager'>"); builder.Append("<span class='p'>");
builder.AppendFormat("共 {0} 条数据 页次：{1}/{2}", pagedList.totalItemCount, pagedList.pageIndex, pagedList.totalPageCount, "上一页");
builder.Append("</span>");
builder.Append(" ");
builder.Append(" ");
builder.Append(" ");
builder.Append(" ");
if (pagedList.pageIndex > && pagedList.pageIndex <= pagedList.totalPageCount)
{
builder.Append("<span class='p'>");
builder.AppendFormat("<a href='{0}?pageIndex={1}'>{2}</a>", url, , "首页");
builder.Append("</span>");
builder.Append(" ");
builder.Append("<span class='p'>");
builder.AppendFormat("<a href='{0}?pageIndex={1}'>{2}</a>", url, pagedList.pageIndex - , "上一页");
builder.Append("</span>");
builder.Append(" ");
}
if (pagedList.totalPageCount > && pagedList.totalPageCount <= )
{
for (int i = ; i <= pagedList.totalPageCount; i++)
{
builder.Append("<span class='p'>");
builder.AppendFormat("<a href='{0}?pageIndex={1}'>{2}</a>", url, i, i);
builder.Append("</span>");
builder.Append(" ");
}
}
else if (pagedList.totalPageCount > )
{
if (pagedList.pageIndex < )
{
for (int i = ; i <= ; i++)
{
builder.Append("<span class='p'>");
builder.AppendFormat("<a href='{0}?pageIndex={1}'>{2}</a>", url, i, i);
builder.Append("</span>");
builder.Append(" ");
}
builder.Append("<span class='p'>");
builder.AppendFormat("<a href='{0}?pageIndex={1}'>{2}</a>", url, , "...");
builder.Append("</span>");
builder.Append(" ");
}
else
{
builder.Append("<span class='p'>");
builder.AppendFormat("<a href='{0}?pageIndex={1}'>{2}</a>", url, (pagedList.pageIndex - ), "...");
builder.Append("</span>");
builder.Append(" ");
if (pagedList.pageIndex >= && pagedList.totalPageCount <= pagedList.pageIndex + )
{
for (int i = pagedList.pageIndex - ; i <= pagedList.totalPageCount; i++)
{
builder.Append("<span class='p'>");
builder.AppendFormat("<a href='{0}?pageIndex={1}'>{2}</a>", url, i, i);
builder.Append("</span>");
builder.Append(" ");
}
}
else
{
for (int i = pagedList.pageIndex - ; i <= pagedList.pageIndex + ; i++)
{
builder.Append("<span class='p'>");
builder.AppendFormat("<a href='{0}?pageIndex={1}'>{2}</a>", url, i, i);
builder.Append("</span>");
builder.Append(" ");
}
builder.Append("<span class='p'>");
builder.AppendFormat("<a href='{0}?pageIndex={1}'>{2}</a>", url, (pagedList.pageIndex + ), "...");
builder.Append("</span>");
builder.Append(" ");
}
} }
if (pagedList.pageIndex >= && pagedList.pageIndex < pagedList.totalPageCount)
{
builder.Append("<span class='p'>");
builder.AppendFormat("<a href='{0}?pageIndex={1}'>{2}</a>", url, pagedList.pageIndex + , "下一页");
builder.Append("</span>");
builder.Append(" ");
builder.Append("<span class='p'>");
builder.AppendFormat("<a href='{0}?pageIndex={1}'>{2}</a>", url, pagedList.totalPageCount, "尾页");
builder.Append("</span>");
builder.Append(" ");
}
builder.Append("</div>");
}
return builder.ToString();
} public static string Pager(string url, IPagedList pagedList, dynamic objAttr)
{
StringBuilder builder = new StringBuilder();
if (pagedList != null)
{
builder.Append("<script type='text/javascript'>");
builder.Append("window.onload = function () {");
builder.Append(" var elements = document.getElementById('pager').childNodes;");
builder.Append(" for (var i = 0; i < elements.length; i++) {");
builder.Append("var txt = elements[i].innerText || elements[i].textContent;");
builder.Append(" if (elements[i].nodeType =='1' && txt == '" + pagedList.pageIndex + "') {");
builder.Append("elements[i].style.textDecoration = 'underline';break; } } }");
builder.Append("</script>");
string paras = "";
PropertyInfo[] infos = objAttr.GetType().GetProperties();
if (infos != null && infos.Any())
{
foreach (var item in infos)
{
paras += string.Format("{0}={1}", item.Name, item.GetValue(objAttr, null));
paras += "&";
}
}
paras = paras + "pageIndex=";
builder.Append("<div id='pager'>"); builder.Append("<span class='p'>");
builder.AppendFormat("共 {0} 条数据 页次：{1}/{2}", pagedList.totalItemCount, pagedList.pageIndex, pagedList.totalPageCount, "上一页");
builder.Append("</span>");
builder.Append(" ");
builder.Append(" ");
builder.Append(" ");
builder.Append(" "); if (pagedList.pageIndex > && pagedList.pageIndex <= pagedList.totalPageCount)
{
builder.Append("<span class='p'>");
builder.AppendFormat("<a href='{0}?{1}'>{2}</a>", url, paras + , "首页");
builder.Append("</span>");
builder.Append(" ");
builder.Append("<span class='p'>");
builder.AppendFormat("<a href='{0}?{1}'>{2}</a>", url, paras + (pagedList.pageIndex - ), "上一页");
builder.Append("</span>");
builder.Append(" ");
}
if (pagedList.totalPageCount > && pagedList.totalPageCount <= )
{
for (int i = ; i <= pagedList.totalPageCount; i++)
{
builder.Append("<span class='p'>");
builder.AppendFormat("<a href='{0}?{1}'>{2}</a>", url, paras + i, i);
builder.Append("</span>");
builder.Append(" ");
}
}
else if (pagedList.totalPageCount > )
{
if (pagedList.pageIndex < )
{
for (int i = ; i <= ; i++)
{
builder.Append("<span class='p'>");
builder.AppendFormat("<a href='{0}?{1}'>{2}</a>", url, paras + i, i);
builder.Append("</span>");
builder.Append(" ");
}
builder.Append("<span class='p'>");
builder.AppendFormat("<a href='{0}?{1}'>{2}</a>", url, paras + , "...");
builder.Append("</span>");
builder.Append(" ");
}
else
{
builder.Append("<span class='p'>");
builder.AppendFormat("<a href='{0}?{1}'>{2}</a>", url, paras + (pagedList.pageIndex - ), "...");
builder.Append("</span>");
builder.Append(" ");
if (pagedList.pageIndex >= && pagedList.totalPageCount <= pagedList.pageIndex + )
{
for (int i = pagedList.pageIndex - ; i <= pagedList.totalPageCount; i++)
{
builder.Append("<span class='p'>");
builder.AppendFormat("<a href='{0}?{1}'>{2}</a>", url, paras + i, i);
builder.Append("</span>");
builder.Append(" ");
}
}
else
{
for (int i = pagedList.pageIndex - ; i <= pagedList.pageIndex + ; i++)
{
builder.Append("<span class='p'>");
builder.AppendFormat("<a href='{0}?{1}'>{2}</a>", url, paras + i, i);
builder.Append("</span>");
builder.Append(" ");
}
builder.Append("<span class='p'>");
builder.AppendFormat("<a href='{0}?{1}'>{2}</a>", url, paras + (pagedList.pageIndex + ), "...");
builder.Append("</span>");
builder.Append(" ");
} } }
if (pagedList.pageIndex >= && pagedList.pageIndex < pagedList.totalPageCount)
{
builder.Append("<span class='p'>");
builder.AppendFormat("<a href='{0}?{1}'>{2}</a>", url, paras + (pagedList.pageIndex + ), "下一页");
builder.Append("</span>");
builder.Append(" ");
builder.Append("<span class='p'>");
builder.AppendFormat("<a href='{0}?{1}'>{2}</a>", url, paras + pagedList.totalPageCount, "尾页");
builder.Append("</span>");
builder.Append(" ");
}
builder.Append("</div>");
}
return builder.ToString();
} }
}
4. PagerLinqExtension（ 基于linq的扩展）
using System;
using System.Collections.Generic;
using System.Linq;
using System.Linq.Expressions;
using System.Web; namespace Infrastruction.Pager
{
public static class PagerLinqExtension
{ public static PagedList<T> ToPagedList<T>(this IQueryable<T> source, int pageIndex, int pageSize)
{
return new PagedList<T>(source, pageIndex, pageSize);
} }
}
调用方法
1.Webform调用: <%=PagerHelper.Pager("Products.aspx", pageList, new { cid=Cid})%> 或者用literal在后台绑定也行
2.Mvc调用:
需要扩展一下方法
namespace System.Web.Mvc.Html
{
public static class HtmlExtension
{
public static IHtmlString Pager(this HtmlHelper helper, string url, IPagedList pagedList)
{
return helper.Raw(PagerHelper.Pager(url, pagedList));
}
public static IHtmlString Pager(this HtmlHelper helper, string url, IPagedList pagedList, dynamic objAttr)
{
return helper.Raw(PagerHelper.Pager(url, pagedList, objAttr));
}
}
}
然后页面调用@Html.Pager("Products.aspx", pageList, new { cid=Cid,......})
全部的代码都在上面，大家想看的可以看看，有不同想法的也可以和我交流下，左上角有qq。
自己写的一个Pager分页组件,WebForm，Mvc都适用的更多相关文章
- asp.net mvc4+mysql做一个简单分页组件（部分视图）
在开始做mysql分页功能组件前,便设定的是要有一定可复用性.先在项目里Views文件夹下右键新建名为_PaginationComponent.cshtml,这里html及css我采用的bootstr ...
- React自己写的一个地图小组件
由于今天比较闲,就玩了玩react,然后就封装了一个地图的组件,当然功能比较简单,因为就是随手写的小东西,但是由于引用了百度API和bee-mobile,所以用起来可能要薛微麻烦一点点,但是我保证,只 ...
- 自己写的一个jQuery分页插件
;(function($){ $.fn.extend({ pageList: function (json) { function PageList() { this.initHtml = " ...
- 用vue的自定义组件写了一个拖拽 组件,局部的 只能在自定义元素内的
简单实现 没有做兼容<!DOCTYPE html> <html lang="en"> <head> <meta charset=" ...
- 基于Vue.js的表格分页组件
有一段时间没更新文章了,主要是因为自己一直在忙着学习新的东西而忘记分享了,实在惭愧. 这不,大半夜发文更一篇文章,分享一个自己编写的一个Vue的小组件,名叫BootPage. 不了解Vue.js的童鞋 ...
- Vue.js的表格分页组件
转自:http://www.cnblogs.com/Leo_wl/p/5522299.html 有一段时间没更新文章了,主要是因为自己一直在忙着学习新的东西而忘记分享了,实在惭愧. 这不,大半夜发文更 ...
- java+springBoot+Thymeleaf+vue分页组件的定义
导读 本篇着重介绍java开发环境下,如何写一个vue分页组件,使用到的技术点有java.springBoot.Thymeleaf等: 分页效果图 名称为vuepagerbasic的分页组件,只包含上 ...
- 这两天自己模仿写的一个Asp.Net的显示分页方法 附加实体转换和存储过程
之前自己一直用Aspnetpager控件来显示项目中的分页,但是每次都要拖一个aspnetpager的控件进去,感觉很不舒服,因为现在自己写的webform都不用服务器控件了,所以自己仿照aspnet ...
- 基于vue2.0的一个分页组件
分页组件在项目中经常要用到之前一直都是在网上找些jq的控件来用(逃..),最近几个项目用上vue了项目又刚好需要一个分页的功能.于是百度发现几篇文章介绍的实在方式有点复杂, 没耐心看自己动手造轮子写了 ...
随机推荐
- 从express源码中探析其路由机制
引言 在web开发中,一个简化的处理流程就是:客户端发起请求,然后服务端进行处理,最后返回相关数据.不管对于哪种语言哪种框架,除去细节的处理,简化后的模型都是一样的.客户端要发起请求,首先需要一个标识 ...
- Angular2 小贴士 RouterLink 导航
AngularJS的路由一直是学习的一大难点,我们只能边看边学边掌握,边看边学边推翻.今天我们来看一下在angular2中通过routerLink实现导航的几种方式,以及各自的优缺点. Angular ...
- 4D卓越团队-两天培训总结
上周末参加了公司组织的领导力培训课程-4D卓越团队(创业型团队领导力训练项目),感觉有一些用,在这里分享一下. 课前游戏 培训老师先带我们做了一个游戏:每一个人,在同时参加培训的人中找到另外的 6 个 ...
- WPF 虚拟化 VirtualizingWrapPanel 和 VirtualLizingTilePanel
一. UI 上两个扩展 public class VirtualizingWrapPanel : VirtualizingPanel, IScrollInfo { #region Fields UI ...
- 用Fiddler模拟低速网络环境
有时候宽频网路用习惯了… 在开发的过程就比较少去考虑最佳化的问题… 但当有人反应说「你的网页好慢」甚至当网路速度慢,会造成你的网页跳出什么啊哩不哒的bug时要如何重现呢? 我们可以用Fiddler 这 ...
- 高性能 TCP & UDP 通信框架 HP-Socket v3.5.2
HP-Socket 是一套通用的高性能 TCP/UDP 通信框架,包含服务端组件.客户端组件和 Agent 组件,广泛适用于各种不同应用场景的 TCP/UDP 通信系统,提供 C/C++.C#.Del ...
- 《Web开发过滤Javascript、HTML的方法》
JavaScript过滤方法: 第一种方案:使用 htmlspecialchars 函数转换特殊字符和使用 nl2br 函数插入一些必要的 <br /> 标签. $comment = &l ...
- QService 服务容器
原理 服务容器 服务主体,反射执行业务类 管理器 对服务容器进行控制 测试服务 向一个文件写入内容 启用一个HTTP服务 以下为日志: 2015-06-15 11:50:47.5313 Info QS ...
- 【译】Spring 4 基于TaskScheduler实现定时任务（注解）
前言 译文链接:http://websystique.com/spring/spring-job-scheduling-with-scheduled-enablescheduling-annotati ...
- C# 调用 Oracle
C# 调用 Oracle 是如此尴尬 >System.Data.OracleClient.dll —— .Net 自带的 已经 过时作废. >要链接 Oracle 服务器,必须在 本机安装 ...