基于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 ...
随机推荐
- dia无法输入中文？
解决方法: 以管理员权限打开/usr/bin/dia ,做如下修改 #dia-gnome --integrated "$@" dia-gnome "$@"
- Hadoop自学笔记（五）配置分布式Hadoop环境
上一课讲了怎样在一台机器上建立Hadoop环境.我们仅仅配置了一个NHName Node, 这个Name Node里面包括了我们全部Hadoop的东西.包括Name Node, Secondary N ...
- 【Android】3.10 热力图功能
分类:C#.Android.VS2015.百度地图应用: 创建日期:2016-02-04 一.简介 热力图是用不同颜色的区块叠加在地图上描述人群分布.密度和变化趋势的一个产品,可利用自有数据,构建属于 ...
- Spark参数配置
转自:http://hadoop1989.com/2015/10/08/Spark-Configuration/ 一.Spark参数设置 二.查看Spark参数设置 三.Spark参数分类 四.Spa ...
- Qt入门－layout布局
开发一个图形界面应用程序,界面的布局影响到界面的美观.在设计一个界面之前,应该考虑到开发的界面可能给不用的用户使用,而用户的屏幕大小.纵横比例.分辨率可能不同,界面还可能是可缩放的,程序应该可以适应这 ...
- 字符设备驱动笔记——中断方式按键驱动之linux中断处理结构（五）
一.单片机下的中断处理 )分辨是哪一个中断 )调用处理函数 )清中断 二.linux下的中断处理 1)/arch/arm/kernel/irq.c asmlinkage void __exceptio ...
- 解析html文档的java库及范例
用这个工具jsoup <groupId>org.jsoup</groupId> <artifactId>jsoup</artifactId> <v ...
- Hibernate中HQLwhere用法和单独取出几列数据的读取方法
String hql = "select thedate,thehour,node,query_num from Cdns cdns where thehour = " +&quo ...
- LeetCode: Longest Consecutive Sequence 解题报告
Longest Consecutive Sequence Given an unsorted array of integers, find the length of the longest con ...
- 【GitHub】 README.ME 格式
README =========================== 该文件用来测试和展示书写README的各种markdown语法.GitHub的markdown语法在标准的markdown语法 ...