Go to Tools/Libary Package Manager/Manage NuGet Packages for Solution...
Search for pagedList and install it.
Add new controller - in my case it will point to StyleMaster table in my database - I am using EF - more info in my older post - MVC 4 - Simple CRUD example. Once this controller is created - I will have between the others index view with table. My next step will be to add paging functionality to that table.
In style controller add the following using
using PagedList;
then modify index method
public ActionResult Index(int? page)
{
var stylemasters = db.StyleMasters.Include(s => s.GroupMaster).Include(s => s.StyleTypeMaster).OrderBy(s => s.StyleName); //ensure records are sorted.
if (Request.HttpMethod != "GET")
{
page = 1;
}
int pageSize = 2;
int pageNumber = (page ?? 1);
return View(stylemasters.ToPagedList(pageNumber, pageSize));
}
in view replace
@model IEnumerable<MvcTestingCRUD.Models.StyleMaster>
with
@model PagedList.IPagedList<MvcTestingCRUD.Models.StyleMaster>
replace code that looks like
<th>
@Html.DisplayNameFor(model => model.StyleId)
</th>
with
<th>
@Html.DisplayNameFor(model => model.First().StyleId)
</th>
at the end of the page after </table> add the following div
<div>
Page @(Model.PageCount < Model.PageNumber ? 0 : Model.PageNumber) of @Model.PageCount
@if (Model.HasPreviousPage)
{
@Html.ActionLink("<<", "Index", new { page = 1})
@Html.Raw(" ");
@Html.ActionLink("< Prev", "Index", new {page = Model.PageNumber - 1})
}
else{
@:<<
@Html.Raw(" ");
@:< Prev
}
@if (Model.HasNextPage)
{
@Html.ActionLink("Next >", "Index", new {page = Model.PageNumber + 1})
@Html.Raw(" ");
@Html.ActionLink(">>", "Index", new {page = Model.PageCount})
}
else{
@:Next >
@Html.Raw(" ")
@:>>
}
</div>
That's it. Now when you run your website - paging will be presented:
