MVC中使用MVCPager简单分页
2024-09-07 11:20:03
一、建立数据库以及建立MVC项目
自己随便建立一个数据库,并且添加数据。我建立的数据库如下。
二、建立LINQ to SQL映射。
然后一步步点确定
三、编写代码
在Controllers中建立控制器,模板为空。建立的项目如下:
要添加视图Index
在Controller中选中Index 并且添加视图, 模板选中List, 如下
注意后台要添加对MvcPager的程序集引用,后台代码如下:
using Webdiyer.WebControls.Mvc;
public class StudentController : Controller
{
//
// GET: /Student/ public ActionResult Index(int id=1)
{
Models.StudentEntityDataContext student= new Models.StudentEntityDataContext();
IQueryable<Models.S> p = from c in student.S
select c;
PagedList<Models.S> m = p.ToPagedList(id,10);
return View(m);
}
}
前台代码如下:
@model PagedList<MvcApplication1.Models.S> @{
Layout = null;
}
@using Webdiyer.WebControls.Mvc; //添加对程序集的引用
<!DOCTYPE html> <html>
<head>
<title>Index</title>
// 控制分页的CSS样式
<style type="text/css">
table, td
{
font: 100% Arial, Helvetica, sans-serif;
}
table
{
width: 100%;
border-collapse: collapse;
margin: 1em 0;
}
th, td
{
text-align: left;
padding: .5em;
border: 1px solid #fff;
}
th
{
background: #328aa4;
color: #fff;
}
td
{
background: #e5f1f4;
} /*div布局*/
.div float
{
float: left;
width: 50%;
}
#div pages
{
height: 300px;
}
/*分页工具栏样式*/
.pages
{
color: #045FB4;
font-weight: bold;
font-size: 14px;
} .pages .item
{
padding: 1px 6px;
font-size: 14px;
}
/*号码页数*/ .pages .cpb
{
color: #045FB4;
padding: 1px 6px;
font-size: 13px;
}
/*当前页数*/ .pages a
{
text-decoration: none;
padding: 0 5px;
border: 1px solid #BDBDBD;
margin: 0 2px;
color: #000;
font-weight: normal;
} .pages a:hover
{
background-color: #0174DF;
color: #fff;
border: 1px solid #0174DF;
text-decoration: none;
font-weight: normal;
}
</style>
</head>
<body>
<p>
@Html.ActionLink("Create New", "Create")
</p>
<table>
<tr>
<th>
学号
</th>
<th>
姓名
</th>
<th>
性别
</th>
<th>
准考证
</th>
<th>
专业
</th>
<th>
院系
</th>
<th>
考场
</th>
<th>
座位
</th>
<th>
编排校区
</th>
<th>
语言级别
</th>
<th>
年级
</th>
<th></th>
</tr> @foreach (var item in Model) {
<tr>
<td>
@Html.DisplayFor(modelItem => item.学号)
</td>
<td>
@Html.DisplayFor(modelItem => item.姓名)
</td>
<td>
@Html.DisplayFor(modelItem => item.性别)
</td>
<td>
@Html.DisplayFor(modelItem => item.准考证)
</td>
<td>
@Html.DisplayFor(modelItem => item.专业)
</td>
<td>
@Html.DisplayFor(modelItem => item.院系)
</td>
<td>
@Html.DisplayFor(modelItem => item.考场)
</td>
<td>
@Html.DisplayFor(modelItem => item.座位)
</td>
<td>
@Html.DisplayFor(modelItem => item.编排校区)
</td>
<td>
@Html.DisplayFor(modelItem => item.语言级别)
</td>
<td>
@Html.DisplayFor(modelItem => item.年级)
</td>
<td>
@Html.ActionLink("Edit", "Edit", new { /* id=item.PrimaryKey */ }) |
@Html.ActionLink("Details", "Details", new { /* id=item.PrimaryKey */ }) |
@Html.ActionLink("Delete", "Delete", new { /* id=item.PrimaryKey */ })
</td>
</tr>
} </table> //这里是分页的控制
<div>
@Html.AjaxPager(Model, new PagerOptions() { CssClass = "pages", PageIndexParameterName = "id",
ShowPageIndexBox = true, PageIndexBoxType = PageIndexBoxType.TextBox, ShowGoButton = true,
PageIndexBoxWrapperFormatString="转到{0}"}, new AjaxOptions() { UpdateTargetId = "dvOrders" }) </div> </body>
</html>
四、最终分页效果
代码下载地址: http://download.csdn.net/detail/luoyangwyb/7581651
MvcPager官方下载网址:http://mvcpager.codeplex.com/releases/view/47201
Demo的示例网址:http://en.webdiyer.com/
最新文章
- node.js 的事件驱动
- 将csv文件读入数据库
- ubuntu为用户增加sudoer权限的两种方法
- getopt
- Oracle 数据类型
- (转)SQLLite数据操作
- 应用c#读取带cookie的http数据
- HDU5764 After a Sleepless Night 树形乱搞题
- HDU-4686 Arc of Dream 构造矩阵
- 解决FLASH最高层的问题,让FLASH置于div之下
- JavaScript拖拽
- Java IO学习笔记一
- 通过TCP实现显示屏截图请求及回传
- Linux命令之文件搜索
- Elasticsearch笔记九之优化
- 分享Winform datagridview 动态生成中文HeaderText
- 【转】ASP.NET中验证控件的使用
- Object.create() vs new SomeFunction() in javascript
- db2常见命令
- 【转】在SpringMVC Controller中注入Request成员域
热门文章
- Real-Time Compressive Tracking 论文笔记
- 微软Build2016:Xamarin杂记
- 用bis和bic实现位级操作
- 清理一下电脑垃圾,打开Eclipse发现左边的所有项目消失了
- 2016/3/27 分页 共X条数据 本页x条 本页从x-y条 x/y页 首页 上一页 123456 下一页 末页 pagego echo $page->;fpage(7,6,5,4,3,2,1,0);
- 跨域,Content-Type组件
- linux driver开发
- go---weichart个人对Golang中并发理解
- USACO35 翻转奶牛(尺取法)
- YTU 2955: A改错题--销售部的打印机