Asp.net MVC 使用PagedList(新的已更名 为X.PagedList.Mvc) 分页
在asp.net mvc 中,可以bootstrap来作为界面,自己来写分页程序。也可以使用PagedList(作者已更名为 X.PagedList.Mvc)来分页。
1、首先,在NuGet程序包管理控制台 ,输入Install-Package PagedList.mvc 安装PagedList 和PageList.Mvc;查看程序中的引用,已经有了PagedList,和PagedList.Mvc两个文件的引用
2、使用PagedList,下面是微软官方的一个实现了排序、查找、分页功能的例子。通过多设置一个查找变量参数来保存当时的查找字符串 currentFilter,,分页、排序的时候都使用currentFilter来作为参数传递。而一旦在 UI中重新输入查找字符串,就将页码设置为第一页。
控制器代码:
using PagedList;
public ActionResult Index(string sortOrder,string currentFilter,string searchString,int? page)
{
ViewBag.CurrentSort = sortOrder;
ViewBag.FirstNameSortParam = string.IsNullOrEmpty(sortOrder) ? "FirstName_desc" : "";
ViewBag.LastNameSortParam = sortOrder == "LastName" ? "LastName_desc" : "LastName";
ViewBag.DateSortParam = sortOrder == "date" ? "date_desc" : "date";
var students = from s in db.Students
select s;
if (searchString != null)
{
page = 1;
}
else
{
searchString = currentFilter;
}
ViewBag.CurrentFilter = searchString;
if (!string.IsNullOrEmpty(searchString)) //注意,判断字符串类型为空,要使用String.IsNullEmpty() 而不能使用 !=null 来判断。
{
students= students.Where(s => s.LastName.ToUpper() .Contains(searchString.ToUpper())
|| s.FirstMidName.ToUpper().Contains(searchString.ToUpper()));
}
//ViewBag.searchString = searchString;
switch (sortOrder)
{
case "FirstName_desc":
students = students.OrderByDescending(s => s.FirstMidName);
break;
case "LastName":
students = students.OrderBy(s => s.LastName);
break;
case "LastName_desc":
students = students.OrderByDescending(s => s.LastName);
break;
case "date":
students =students.OrderBy(s =>s.EnrollmentDate);
break;
case "date_desc":
students = students.OrderByDescending(s => s.EnrollmentDate);
break;
default:
students = students.OrderBy(s => s.FirstMidName);
break;
}
int pageSize = 2;
int pageNumber = (page ?? 1);
return View(students.ToPagedList(pageNumber,pageSize));
}
视图代码:
@model PagedList.IPagedList<ContosoUniversity.Models.Student>
@using PagedList.Mvc;
<link href="~/Content/PagedList.css" rel="stylesheet" type="text/css" />
@{
ViewBag.Title = "学生";
}
<h2>@ViewBag.Title</h2>
<p>
@Html.ActionLink("Create New", "Create")
</p>
@using (Html.BeginForm("Index", "Student", FormMethod.Get, new { @class="form-inline",role="form" }))
{
<label for="searchString" class="control-label">通过名字查找:</label>
<div class="form-group">
@Html.TextBox("searchString", ViewBag.CurrentFilter as string, htmlAttributes: new { @class = "form-control", placeholder = "请输入名字" }) //只是在文本框中回显当时查找的字符串,并没 将 name为searchString的文本框表单提交
</div>
<input type="submit" value="查找" class="btn btn-primary" />
}
<table class="table table-hover table-striped">
<thead>
<tr>
<th>
@Html.ActionLink("名", "Index", new { sortOrder = ViewBag.LastNameSortParam, currentFilter = ViewBag.CurrentFilter })
</th>
<th>
@Html.ActionLink("姓", "Index", new { sortOrder = ViewBag.FirstNameSortParam, currentFilter = ViewBag.CurrentFilter })
</th>
<th>
@Html.ActionLink("入学时间", "Index", new { sortOrder = ViewBag.DateSortParam, currentFilter = ViewBag.CurrentFilter })
</th>
<th></th>
</tr>
</thead>
<tbody>
@foreach (var item in Model)
{
<tr>
<td>
@Html.DisplayFor(modelItem => item.LastName)
</td>
<td>
@Html.DisplayFor(modelItem => item.FirstMidName)
</td>
<td>
@Html.DisplayFor(modelItem => item.EnrollmentDate)
</td>
<td>
@Html.ActionLink("Edit", "Edit", new { id = item.ID }) |
@Html.ActionLink("Details", "Details", new { id = item.ID }) |
@Html.ActionLink("Delete", "Delete", new { id = item.ID })
</td>
</tr>
}
</tbody>
</table>
<br />
Page @(Model.PageCount< Model.PageNumber ? 0: Model.PageNumber)of @Model.PageCount
@Html.PagedListPager(Model, page => Url.Action("Index",
new { page, sortOrder = ViewBag.CurrentSort, currentFilter = ViewBag.CurrentFilter }))
二、也可使用可选参数来指定page参数值为1,这样在index方法中就少一个保存当前查询的字符串参数值了。这样更为简洁易懂,特别适用于多个查询字符或多个下拉框选择的情况。
控制器代码:
using PagedList;
public ActionResult Index(string sortOrder,string searchString,int page =1) //使用可选参数 page默认值为1.
{
ViewBag.CurrentSort = sortOrder;
ViewBag.FirstNameSortParam = string.IsNullOrEmpty(sortOrder) ? "FirstName_desc" : "";
ViewBag.LastNameSortParam = sortOrder == "LastName" ? "LastName_desc" : "LastName";
ViewBag.DateSortParam = sortOrder == "date" ? "date_desc" : "date";
var students = from s in db.Students
select s;
ViewBag.SearchString = searchString;
if (!string.IsNullOrEmpty(searchString))
{
students= students.Where(s => s.LastName.ToUpper() .Contains(searchString.ToUpper())
|| s.FirstMidName.ToUpper().Contains(searchString.ToUpper()));
}
//ViewBag.searchString = searchString;
switch (sortOrder)
{
case "FirstName_desc":
students = students.OrderByDescending(s => s.FirstMidName);
break;
case "LastName":
students = students.OrderBy(s => s.LastName);
break;
case "LastName_desc":
students = students.OrderByDescending(s => s.LastName);
break;
case "date":
students =students.OrderBy(s =>s.EnrollmentDate);
break;
case "date_desc":
students = students.OrderByDescending(s => s.EnrollmentDate);
break;
default:
students = students.OrderBy(s => s.FirstMidName);
break;
}
int pageSize = 2;
//ViewBag.TotalRecords = students.Count(); //因为PagedList.MVC中 IPagedList类型自带的有集合总记录数、每页最大记录数。 @Model.PageSize 指设置的是每页最大记录数。 @Model.TotalItemCount 总的最大记录数,所以可以不使用ViewBag对象将最大记录数和每页最大记录数返回视图。
// ViewBag.recordPerpage = pageSize;
return View(students.ToPagedList(page,pageSize));
}
视图代码:
@model PagedList.IPagedList<ContosoUniversity.Models.Student>
@using PagedList.Mvc;
<link href="~/Content/PagedList.css" rel="stylesheet" type="text/css" />
@{
ViewBag.Title = "学生";
}
<h2>@ViewBag.Title</h2>
<p>
@Html.ActionLink("Create New", "Create")
</p>
@using (Html.BeginForm("Index", "Student", FormMethod.Get, new { @class="form-inline",role="form" }))
{
<label for="searchString" class="control-label">通过名字查找:</label>
<div class="form-group">
@Html.TextBox("searchString", ViewBag.SearchString as string, htmlAttributes: new { @class = "form-control", placeholder = "请输入名字" }) //只是在文本框中回显当时查找的字符串,并没 将 name为searchString的文本框表单提交
</div>
<input type="submit" value="查找" class="btn btn-primary" />
}
<table class="table table-hover table-striped">
<thead>
<tr>
<th>
@Html.ActionLink("名", "Index", new { sortOrder = ViewBag.LastNameSortParam, searchString = ViewBag.SearchString })
</th>
<th>
@Html.ActionLink("姓", "Index", new { sortOrder = ViewBag.FirstNameSortParam, searchString = ViewBag.SearchString })
</th>
<th>
@Html.ActionLink("入学时间", "Index", new { sortOrder = ViewBag.DateSortParam, searchString= ViewBag.SearchString })
</th>
<th></th>
</tr>
</thead>
<tbody>
@foreach (var item in Model)
{
<tr>
<td>
@Html.DisplayFor(modelItem => item.LastName)
</td>
<td>
@Html.DisplayFor(modelItem => item.FirstMidName)
</td>
<td>
@Html.DisplayFor(modelItem => item.EnrollmentDate)
</td>
<td>
@Html.ActionLink("Edit", "Edit", new { id = item.ID }) |
@Html.ActionLink("Details", "Details", new { id = item.ID }) |
@Html.ActionLink("Delete", "Delete", new { id = item.ID })
</td>
</tr>
}
</tbody>
<tfoot>
<tr>
<th class="text-info" colspan="5">
每页 @Model.PageSize.ToString() 条记录,共有 @Model.TotalItemCount.ToString() 条记录。第 @(ViewBag.TotalRecords == 0 ? 0 : Model.PageNumber) 页,共 @Model.PageCount 页。 或者
每页 @Model.PageSize 条记录,共有 @Model.TotalItemCount 条记录。第 @(Model.PageCount < Model.PageNumber ? 0 :Model.PageNumber) 页,共 @Model.PageCount 页。
这个条件表达式的目的是防止出现 记录为0的情况,会出现 总页数为0,而当前是第1页的情况。
//PagedList.MVC中 IPagedList类型自带的有分页中用到的参数如:集合总记录数、每页最大记录数。
@Model.PageSize 指设置的是每页最大记录数,
@Model.TotalItemCount 总的记录数 ,
@Model.PageCount 总页数,
@Model.PageNumber 第几页,
@Model.Count() 当前页面上包含的记录数。
</th>
</tr>
</tfoot>
</table>
<br />
//Page @(Model.PageCount< Model.PageNumber ? 0: Model.PageNumber)of @Model.PageCount
@Html.PagedListPager(Model, page => Url.Action("Index",
new { page, sortOrder = ViewBag.CurrentSort, searchString = ViewBag.SearchString }))
Html.PagedListPager(Model,Url,PagedListRenderOptions) 分页辅助方法的 new PagedListRenderOptions() 参数可自定义显示格式,可以
例如:
@Html.PagedListPager(Model, page => Url.Action("Index", new { page }), new PagedListRenderOptions() { LinkToFirstPageFormat = "首页", LinkToNextPageFormat = "下一页", LinkToPreviousPageFormat = "上一页", LinkToLastPageFormat = "末页", DisplayItemSliceAndTotal = false, MaximumPageNumbersToDisplay = 3 })
三、也可以 在视图中使用参数来配置每页显示的条数。如果不使用Ajax异步提交的话,
视图的表单上可以添加,size属性用来设置显示文本框的宽度,在Bootstrap样式下同样实用,另外,maxlength用来设置文本框接受字符的个数,输多了输不进去。
<label for="pageSize" class="control-label">每页指定记录数:</label>
<div class="form-group">
@Html.TextBox("pageSize", ViewBag.pageSize as string, htmlAttributes: new { @class = "form-control", size = "1", maxlength = "1" })
</div>
但是需要在排序,分页中的 html中加入控制器返回的page参数值,page值由控制器返回ViewBag.page参数
如:排序 @Html.ActionLink("评审项目类别", "Index", new { sortOrder = ViewBag.CategoryNameSortParam, searchString = ViewBag.searchString, categoryID = ViewBag.categoryID, isUsed = ViewBag.isUsed, pageSize = ViewBag.pageSize })
分页:
<tfoot>
<tr>
<td class="text-muted" colspan="5">
每页 @Model.PageSize 条记录,共有 @Model.TotalItemCount 条记录。第 @(Model.PageCount < Model.PageNumber ? 0 :Model.PageNumber) 页,共 @Model.PageCount 页。
</td>
</tr>
</tfoot>
</table>
@Html.PagedListPager(Model, page => Url.Action("Index", new { page, sortOrder = ViewBag.CurrentSort, searchString = ViewBag.searchString, categoryID = ViewBag.categoryID, isUsed = ViewBag.isUsed, pageSize = ViewBag.pageSize }),
new PagedListRenderOptions { LinkToFirstPageFormat = "首页", LinkToNextPageFormat = "下一页", LinkToPreviousPageFormat = "上一页", LinkToLastPageFormat = "末页", MaximumPageNumbersToDisplay = 3, DisplayItemSliceAndTotal = false }
控制器:
public ActionResult Index(string sortOrder,string searchString,string categoryID,bool? isUsed,int page=1,int pageSize =2 )
{
//设置每个页面显示记录条数
ViewBag.pageSize = pageSize;
实现的全部效果如图:
总结,排序、分页程序从本质上讲,就是视图 调用控制器的操作方法,需要什么结果,就传入什么参数。控件值要通过表单提交的方式传入,排序通过链接实现。