基于mvcpager的分页(get请求,刷新页面),提供两种样式(来自bootstrap的样式)
使用方法:
先把mvcpager.dll引用加入mvc项目 下载路径在本文末尾
前台代码
前台:
@{
Layout = null;
}
@using Webdiyer.WebControls.Mvc
@model PagedList<string>
<!DOCTYPE html> <html>
<head>
<meta name="viewport" content="width=device-width" />
<title>Index</title> <link href="~/Content/css_pager.css" rel="stylesheet" /> </head>
<body>
<div>
@foreach (var item in Model)
{
@item<br />
}
</div>
<div style="text-align:center;">
@Html.Pager(Model, new PagerOptions { PageIndexParameterName = "pageIndex", ContainerTagName = "ul", PrevPageText = "上页", NextPageText = "下页", FirstPageText = "首页", LastPageText = "尾页", CssClass = "pagination", PagerItemsSeperator = "", CurrentPagerItemWrapperFormatString = "<li class=\"active\"><a href=\"#\">{0}</a></li>", PagerItemWrapperFormatString = "<li>{0}</li>" }, new { id = "bootstrappager", @class = "pagination" })
<!-- @class 可为pagination或pager 样式可自行修改样式表-->
</div>
</body>
</html>
后台代码
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
using Webdiyer.WebControls.Mvc;
namespace MvcApplication6.Controllers
{
public class HomeController : Controller
{
//
// GET: /Home/ public ActionResult Index(int pageIndex=, int pageSize=)
{
List<string> list = new List<string>(){
"a",
"b",
"c",
"d"
};
return View(list.ToPagedList(pageIndex, pageSize));
} }
}
@Html.Pager(Model, new PagerOptions { PageIndexParameterName = "pageIndex", ContainerTagName = "ul", PrevPageText = "上页", NextPageText = "下页", FirstPageText = "首页", LastPageText = "尾页", CssClass = "pagination", PagerItemsSeperator = "", CurrentPagerItemWrapperFormatString = "<li class=\"active\"><a href=\"#\">{0}</a></li>", PagerItemWrapperFormatString = "<li>{0}</li>" }, new { id = "bootstrappager", @class = "pagination" })
样式更改:class为pager或pagination
如图:
aaarticlea/png;base64,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" alt="" />
下载路径: http://files.cnblogs.com/files/gaocong/MvcPager.rar
样式文件:
.pagination {
border-radius: 4px;
display: inline-block;
margin: 20px 0;
padding-left:;
}
.pagination > li {
display: inline;
}
.pagination > li > a, .pagination > li > span {
background-color: #fff;
border: 1px solid #ddd;
color: #337ab7;
float: left;
line-height: 1.42857;
margin-left: -1px;
padding: 6px 12px;
position: relative;
text-decoration: none;
}
.pagination > li:first-child > a, .pagination > li:first-child > span {
border-bottom-left-radius: 4px;
border-top-left-radius: 4px;
margin-left:;
}
.pagination > li:last-child > a, .pagination > li:last-child > span {
border-bottom-right-radius: 4px;
border-top-right-radius: 4px;
}
.pagination > li > a:hover, .pagination > li > span:hover, .pagination > li > a:focus, .pagination > li > span:focus {
background-color: #eee;
border-color: #ddd;
color: #23527c;
z-index:;
}
.pagination > .active > a, .pagination > .active > span, .pagination > .active > a:hover, .pagination > .active > span:hover, .pagination > .active > a:focus, .pagination > .active > span:focus {
background-color: #337ab7;
border-color: #337ab7;
color: #fff;
cursor: default;
z-index:;
}
.pagination > .disabled > span, .pagination > .disabled > span:hover, .pagination > .disabled > span:focus, .pagination > .disabled > a, .pagination > .disabled > a:hover, .pagination > .disabled > a:focus {
background-color: #fff;
border-color: #ddd;
color: #777;
cursor: not-allowed;
}
/*.pagination-lg > li > a, .pagination-lg > li > span {
font-size: 18px;
line-height: 1.33333;
padding: 10px 16px;
}
.pagination-lg > li:first-child > a, .pagination-lg > li:first-child > span {
border-bottom-left-radius: 6px;
border-top-left-radius: 6px;
}
.pagination-lg > li:last-child > a, .pagination-lg > li:last-child > span {
border-bottom-right-radius: 6px;
border-top-right-radius: 6px;
}
.pagination-sm > li > a, .pagination-sm > li > span {
font-size: 12px;
line-height: 1.5;
padding: 5px 10px;
}
.pagination-sm > li:first-child > a, .pagination-sm > li:first-child > span {
border-bottom-left-radius: 3px;
border-top-left-radius: 3px;
}
.pagination-sm > li:last-child > a, .pagination-sm > li:last-child > span {
border-bottom-right-radius: 3px;
border-top-right-radius: 3px;
}*/
.pager {
list-style: outside none none;
margin: 20px 0;
padding-left:;
text-align: center;
}
.pager li {
display: inline;
}
.pager li > a, .pager li > span {
background-color: #fff;
border: 1px solid #ddd;
border-radius: 15px;
display: inline-block;
padding: 5px 14px;
text-decoration: none;
}
.pager li > a:hover, .pager li > a:focus {
background-color: #eee;
text-decoration: none;
}
.pager .next > a, .pager .next > span {
float: right;
}
.pager .previous > a, .pager .previous > span {
float: left;
}
.pager .disabled > a, .pager .disabled > a:hover, .pager .disabled > a:focus, .pager .disabled > span {
background-color: #fff;
color: #777;
cursor: not-allowed;
}
.pager > .active > a, .pager > .active > span, .pager > .active > a:hover, .pager > .active > span:hover, .pager > .active > a:focus, .pager > .active > span:focus {
background-color: #eee;
cursor: default;
z-index:;
}
基于mvcpager的分页(get请求,刷新页面),提供两种样式(来自bootstrap的样式)的更多相关文章
- Javascript刷新页面的几种方法
Javascript刷新页面的几种方法: window.navigate(location)location.reload()location=locationlocation.assign(loca ...
- Javascript刷新页面的八种方法
/** * Javascript刷新页面的八种方法 * 说明一下,jQuery没有发现刷新页面的方法. */ 1 history.go(0) 2 location.reload() 3 locatio ...
- JS刷新页面的几种方法(转)
Javascript刷新页面的几种方法: 1 history.go(0) 2 location.reload() 3 location=location 4 location.assign(locat ...
- Javascript刷新页面的几种方法:
Javascript刷新页面的几种方法: 1 history.go(0) 2 window.location.reload() window.location.reload(true) ...
- js刷新页面的几种方式与区别
Javascript刷新页面的几种方法:1 history.go(0) 2 location.reload() 3 location=location 4 location.assign(locati ...
- 网络笔记01-3 socket 实现百度页面的两种方式
scoket 实现百度页面的两种方式: 1.利用系统自带 //1.创建URL NSURL *url=[NSURL URLWithString:@"http://m.baidu.com& ...
- WebView加载页面的两种方式——网络页面和本地页面
WebView加载页面的两种方式 一.加载网络页面 加载网络页面,是最简单的一种方式,只需要传入http的URL就可以,实现WebView加载网络页面 代码如下图: 二.加载本地页面 1.加载asse ...
- Apacheserver自己定义404页面的两种方法以及.htaccess的重要命令总结
Apacheserver自己定义404错误页面有两种方法: 第一种方法最简单,直接在Apache的httpd.conf下进行配置改动命令,改动的内容请參看.htaccess命令写法中的自己定义错误页面 ...
- 用easyui从servlet传递json数据到前端页面的两种方法
用easyui从servlet传递json数据到前端页面的两种方法 两种方法获取的数据在servlet层传递的方法相同,下面为Servlet中代码,以查询表中所有信息为例. //重写doGet方法 p ...
随机推荐
- unity, 查看内置shader源码
1,建一个球体. 2,建一个材质,将材质拖到球体上. 3,在材质的shader下拉列表中选择想查看的内置shader,点材质栏右上设置按钮->Select Shader 进入shader面板. ...
- Spring RestTemplate使用教程
简介 Spring'scentral class for synchronous client-side HTTP access.It simplifies communication with HT ...
- windows xp 创建 Oracle(11G)数据库实例时写入系统日志失败解决方案
1.查看Windows日志相关服务(Even Log),无异常: 2.清空事件管理器中“应用程序”和“系统节点”的内容,对这两个节点,分别在“属性”页面用增大“最大日志文件大小”的值,并选中“按需要改 ...
- 临界区&Monitor
监视器(Monitor)的概念 可以在MSDN(http://msdn.microsoft.com/zh-cn/library/ms173179(VS.80).aspx)上找到下面一段话: 与lock ...
- java 生成泛型的参数的实例 T t=new T()
方法1 ParameterizedType ptype = (ParameterizedType) this.getClass().getGenericSuperclass(); Class claz ...
- C#中一道关于ADO.NET的基础练习题
在控制台程序中实现以下功能: 1. 构建3个表(程序启动时自动建立) (20分): 1) Employee 职工表 (工号.姓名.性别.年龄.部门) (Num.Name.Sex.Age.Depar ...
- 一款由jquery实现的超炫的页面加载特效
今天为大家带来一款由jquery实现的超炫的页面加载特效.连续的几个页面分开特效.最后由三维的线条由远至近消失,然后由近至远出现.效果超级梦炫.一起看下效果图: 在线预览 源码下载 实现的代码. ...
- Session过期后自动跳转到登录页面
最近研究如果用原生的Filter来判别session存在否或者过期否.来跳转到的页面实例,下载来展示代码. 因为顾虑器是每次请求能会进入的,所以可以设置了,进行拦截判断 1.配置web.xml < ...
- FireFox火狐不能设置新标签页
问题:已经在Tab Mix Plus中设置了新建标签页为自定义的网址,但依然没用. 百度很多都是让改about:config中的browser.newtab.url,然而这并没卵用. 办法:https ...
- java日期工具类DateUtil-续一
上篇文章中,我为大家分享了下DateUtil第一版源码,但就如同文章中所说,我发现了还存在不完善的地方,所以我又做了优化和扩展. 更新日志: 1.修正当字符串日期风格为MM-dd或yyyy-MM时,若 ...