Fork me on GitHub

MvcPager demo - Display paging information

This sample demonstrates how to display paging information like page count, current page index and total item count.

Order ID Customer ID Company Name Employee Name
10795 ERNSH Ernst Handel Laura Callahan
10796 HILAA HILARION-Abastos Janet Leverling
10797 DRACD Drachenblut Delikatessen Robert King
10798 ISLAT Island Trading Andrew Fuller
10799 KOENE Königlich Essen Anne Dodsworth
Page 8 of 64, 318 items
 First Prev ... 3 4 5 6 7 8 9 10 11 12 ... Next Last

View:

        
@model PagedList<Order>
@Html.Partial("_DataTable", Model)
<div><div style="float:left;width:50%">Page @Model.CurrentPageIndex of @Model.TotalPageCount, @Model.TotalItemCount items</div>
    @Html.Pager(Model).Options(o=>o.SetPageIndexParameterName("id").SetPagerItemTemplate("&nbsp;{0}").AddHtmlAttribute("style","float:right"))</div>
@section Scripts{@{Html.RegisterMvcPagerScriptResource();}}
    

_DataTable.cshtml:

@model PagedList<order>
<table class="table table-striped table-bordered">
    <tr>
    <th class="nowrap">
            @Html.DisplayNameFor(model => model.OrderId)
        </th>
    <th class="nowrap">
            @Html.DisplayNameFor(model => model.CustomerId)
        </th>
    <th class="nowrap">
            @Html.DisplayNameFor(model => model.CompanyName)
        </th>
    <th class="nowrap">
            @Html.DisplayNameFor(model => model.EmployeeName)
        </th>
    </tr>
    @foreach (var item in Model)
    {
    <tr>
    <td>
                @Html.DisplayFor(modelItem => item.OrderId)
            </td>
    <td>
                @Html.DisplayFor(modelItem => item.CustomerId)
            </td>
    <td>
                @Html.DisplayFor(modelItem => item.CompanyName)
            </td>
    <td>
                @Html.DisplayFor(modelItem => item.EmployeeName)
            </td>
        </tr>
    }
</table>

Model:

    public class Order
    {
        [Display(Name = "Order ID")]
        public int OrderId { get; set; }
        [Display(Name = "Customer ID"),StringLength(20)]
        public string CustomerId { get; set; }
        [Display(Name = "Order Date")]
        public DateTime OrderDate { get; set; }
        [Display(Name = "Company Name"), StringLength(20)]
        public string CompanyName { get; set; }
        [Display(Name = "Employee Name"), StringLength(20)]
        public string EmployeeName { get; set; }
    }

Controller:

        
        public ActionResult CustomInfo(int id = 1)
        {
            using (var db = new DataContext())
            {
                return View(db.Orders.OrderBy(o=>o.OrderId).ToPagedList(id, 5));
            }
        }