利用mvc3实现分页效果。效果图如下:

  

  直接拷代码:

  首页添加一个Helper的类(命名空间为System.Web.Mvc;)。    

  

 public static HtmlString ShowPageNavigate(this HtmlHelper htmlHelper, int currentPage, int pageSize, int totalCount)
{
var redirectTo = htmlHelper.ViewContext.RequestContext.HttpContext.Request.Url.AbsolutePath;
pageSize = pageSize == ? : pageSize;
var totalPages = Math.Max((totalCount + pageSize - ) / pageSize, ); //总页数
var output = new StringBuilder();
if (totalPages > )
{
output.AppendFormat("<a class='pageLink' href='{0}?pageIndex=1&pageSize={1}'>首页</a> ", redirectTo, pageSize);
if (currentPage > )
{//处理上一页的连接
output.AppendFormat("<a class='pageLink' href='{0}?pageIndex={1}&pageSize={2}'>上一页</a> ", redirectTo, currentPage - , pageSize);
} output.Append(" ");
int currint = ;
for (int i = ; i <= ; i++)
{//一共最多显示10个页码,前面5个,后面5个
if ((currentPage + i - currint) >= && (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 + , 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());
}

  其次再添加两个公共类:PagerInfo与PageQuery。PagerInfo类用于放置分页相关内容。PageQuery则用于放置PagerInfo及要显示的数据信息。

  

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

  然后在Controller里面添加Action

  

 public ActionResult Index(int? pageSize,int? pageIndex)
{
int pageIndex1 = pageIndex ?? ;
int pageSize1 = pageSize ?? ;
int count=;
//从数据库在取得数据,并返回总记录数
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);
}

  最要在View里的部分代码如下:

  @model PagerQuery<PagerInfo, IQueryable<_6_16DFAZ_Models.news>>

  最后在body里面要显示的数据如下:  

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

  ok.分页效果已经实现。为了美观,再添加一些样式。  

  

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

  最终的显示图如下:

 

  大功告成!

    

  

  

MVC3 分页Helper的更多相关文章

  1. MVC3 带查询的分页Helper

    接上篇mvc3 分页Helper. 带查询的分页Helper是在上一篇分页的基础上来的.下面看代码: 首先,在System.Web.Mvc命名空间下的自定义类HtmlPage下面添加一个用于处理“查询 ...

  2. Bootstrap+angularjs+MVC3+分页技术+角色权限验证系统

    1.Bootstrap使用教程 相关教程: http://www.bootcss.com/components.html 页面使用代码: <script src="@Url.Conte ...

  3. ASP.NET MVC+Bootstrap个人博客之打造清新分页Helper(三)

    有点另类,分页直接是在后台拼接好html,然后发送到前台的: 1. 分页容器: <div class="pagination"> <ul> //****** ...

  4. 一步步学习ASP.NET MVC3 (6)——@helper,@functions

    请注明转载地址:http://www.cnblogs.com/arhat 在前一章中,我们讲述了View如何从Action中获得数据,并显示出来,但随着需求的变化,我们可能要对View中显示的数据作出 ...

  5. ASP.NET MVC+Bootstrap分页Helper

    <div class="pagination"> <ul> //************分页HTML********* </ul> </d ...

  6. 一步步学习ASP.NET MVC3 章节总结

    请注明转载地址:http://www.cnblogs.com/arhat 对于<一步步学习ASP.NET MVC3>系列工15章,那么为了方便大家能够快速的预览,老魏在这里为这个系列提供一 ...

  7. C# MVC的一种高效分页的html方法

    首先创建一个html的扩展方法,这个方法是万能的,可以直接拿到您的项目中使用: //主要就是输出分页的超级链接的标签 //自定义分页Helper扩展 public static HtmlString ...

  8. MVC异步分页

    如图: 1: 控制器代码 // // GET: /AjaxUser/ shopEntities shop = new shopEntities(); public ActionResult Index ...

  9. C# 分页方法

    using System;using System.Collections.Generic;using System.Linq;using System.Text;using System.Web; ...

随机推荐

  1. spring的官方文真不错

    引文不太好,但是通过别的版本的查看,发现spring的文档真心不错,内容详细明了. http://docs.spring.io/spring/docs/3.2.5.RELEASE/spring-fra ...

  2. iOS断点及打印日志

    首先,最简单的断点就是在Xcode项目文件中任意一行行号那点一下,就是加了一个断点 再次点击会变成浅蓝色,表示disable掉了 disable掉的断点不会起作用,但会在左上角蓝色的标签那留下记录,这 ...

  3. HTML4如何让一个DIV居中对齐?float输入日志标题

    float:left,right clear:both 如何让一个DIV居中对齐? 第一步:设置外层的DIV的text-align:center; 第二步:设置里层的DIV的margin:auto 以 ...

  4. java集合类遍历删除方法测试以及使用场景记录

    package test0; import java.util.List; import java.util.Map; import java.util.Map.Entry; import java. ...

  5. UIButton基础知识

    基本属性 1.frame;坐标:title:titlecolor:字体颜色:titleShadowColor:字体阴影:image:图片: backgroundImage:背景图片: 2.forsta ...

  6. Oracle EBS-SQL (INV-4):检查负库存记录数.sql

    DEFINE DATE1="01/15/20** 23:59:59"      /*输入指定日期*/DEFINE CODE="%"                ...

  7. jsp九九乘法表

    <%@ page language="java" contentType="text/html; charset=utf-8" pageEncoding= ...

  8. 快速开启Safari的私密浏览(快捷键创建)

    正常使用Safari浏览器,都会保存你的浏览记录.搜索记录,包括你的浏览习惯,经常去哪些网站等等.这样的好处是可以帮助你更快速的进入自己需要的网站,节约很多时间. 但有些情况下,你还是会偏向于选择私密 ...

  9. 为啥都不用Qt Quick Controls 2呢

     为啥都不用Qt Quick Controls 2呢  https://github.com/qt/qtquickcontrols2/ 

  10. SQL Server创建LinkServer

    USE [master] GO /****** Object: LinkedServer [xxx_LNK] Script Date: 2014/7/7 17:04:13 ******/ EXEC m ...