Mvcpaging Ajax mode not working

Question

Trying to get the MvcPaging working in Ajax mode, but it's not cooperating! It works, but does a full GET instead of an Ajax call. When I step into the controller code Request.IsAjaxRequest() is false, indicating it's not working correctly. Below is my razor view and the controller code:

@using MvcPaging
@model IPagedList<PracWare.Net.patientnote>

    @Scripts.Render("~/bundles/jquery")
<link href="~/Content/paging.css" rel="stylesheet" />
<link href="~/Content/Bootstrap2.3.1.css" rel="stylesheet" />
<div id="notes-list">
        <table width="98%">
            <tr><th>Date</th><th>Notes</th></tr>
            @foreach (var note in Model)
            {
                <tr><td>@note.dateTime</td><td>@note.notes</td></tr>
            }
        </table>

<div id="paging-control">
    @Html.Raw(Ajax.Pager(
        new Options
            {
                PageSize = 5,
                TotalItemCount = Model.TotalItemCount,
                CurrentPage = Model.PageNumber,
                ItemTexts = new ItemTexts() { Next = "Next", Previous = "Previous", Page = "P" },
                ItemIcon = new ItemIcon() { First = "icon-backward", Previous = "icon-chevron-left", Next = "icon-chevron-right", Last = "icon-forward" },
                TooltipTitles = new TooltipTitles() { Next = "Next page", Previous = "Previous page", Page = "Go to page {0}.", First = "Go To First Page", Last = "Go To Last Page" },
                Size = Size.normal,
                Alignment = Alignment.centered,
                IsShowControls = true,
                IsShowFirstLast = true,
            },
        new AjaxOptions
            {
                UpdateTargetId = "notes-list",
                OnBegin = "beginPaging",
                OnSuccess = "successPaging",
                OnFailure = "failurePaging"
            }, new { controller = "Patient", action = "JqAjaxOrders"}))
    </div>
</div>

And the controller code:

public ActionResult JqAjaxOrders(int? page)
{
     var db = new PracwareEntities();
     var orders = db.patientnotes.OrderBy(o=>o.dateTime).ToPagedList(page ?? 1, 5);
        if (Request.IsAjaxRequest())
            return PartialView("JqAjaxOrders", orders);
        return View(orders);
}

I took this code straight from the MvcPagingDemo solution, which does do the Ajax call correctly. What might I have missed?

Answer 1

I'm sure MvcPaging is great, but I spent 2 hours bashing my head against the screen and couldn't get it to work, so I wrote my own implementation... which took less than 2 hours!

Controller code:

   [Authorize]
    public ActionResult ListNotes(int patientId, int? page = 1)
    {
        const int pageSize = 5;
        var db = new PracwareEntities();
        var totalNotes = db.patientnotes.Count(n => n.patientDbId == patientId);
        var notes = db.patientnotes.OrderBy(o => o.dateTime).Skip((int)((page - 1) * pageSize)).Take(pageSize).Where(n => n.patientDbId == patientId).ToList();

        ViewBag.PageCount = GetPageCount(totalNotes, pageSize);
        ViewBag.CurrentPage = page;
        ViewBag.patientId = patientId;
        if (Request.IsAjaxRequest())
            return PartialView("ListNotes", notes);
        return View(notes);
    }

    private static int GetPageCount(int notesCount, int pageSize)
    {
        var x = (double) notesCount/pageSize;
        if (x - (int) x > 0)
            return (notesCount/pageSize) + 1;
        return (notesCount/pageSize);
    }

Razor view:

@if (ViewBag.PageCount > 1)
{
<div id="paging-control" class="pagination ">
    <ul>
        <li class="first">
            @Html.ActionLink("First", "ListNotes", "Patient", 
                             new {ViewBag.patientId, Page = "1" }, new {@Class="update-notes-list "} )
        </li>
        @for (var i = 1; i <= ViewBag.PageCount; i++)
        {
            <li @if (ViewBag.CurrentPage == i) {
                    <text> class="active"</text>
                } >
                @Html.ActionLink(i.ToString(), "ListNotes", "Patient", 
                                 new {ViewBag.patientId, Page = i.ToString() }, new {@Class="update-notes-list"})
            </li>
        }
        <li class="last">
            @Html.ActionLink("Last", "ListNotes", "Patient", 
                             new { ViewBag.patientId, Page = ViewBag.PageCount }, new {@Class="update-notes-list "} )
        </li>
    </ul>
</div>        
}

Not elegant, but when deadlines are approaching, a working solution is better than no solution!