X.PagedList with ajax
@model IPagedList<RestaurantViewModel>
<div id="restaurantList">
<div class="pagedList" data-otf-target="#restaurantList">
@Html.PagedListPager(Model, page=>Url.Action("Index",new { page= page }), PagedListRenderOptions.MinimalWithItemCountText)
</div>
@foreach (var item in Model)
{
<div class="well-sm ">
<h4>@item.Name</h4>
<div>@item.City, @item.Country</div>
<p>Reviews:@item.NumReviews</p>
<hr />
</div>
}
</div>
var getPage = function () {
var $a = $(this);
var options = {
url: $a.attr("href"),
data:$("form").serialize(),
get: "get"
};
$.ajax(options).done(function (data) {
var target = $a.parents("div.pagedList").attr("data-otf-target");
$(target).replaceWith(data);
});
return false;
}
$(".body-content").on("click", ".pagedList a", getPage);
<div class="container body-content">
@RenderBody()
<hr />
<footer>
<p>© @DateTime.Now.Year - My ASP.NET Application</p>
</footer>
</div>