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;
實現的全部效果如圖：
總結，排序、分頁程式從本質上講，就是檢視 呼叫控制器的操作方法，需要什麼結果，就傳入什麼引數。控制元件值要通過表單提交的方式傳入，排序通過連結實現。