我无法使分页异步。我正在使用 pagedlist 和 pagedListMvc 包。分页似乎工作正常,但是当我添加 Javascript 使其异步时,什么也没有发生,即分页根本不起作用。我不知道为什么这不起作用。请在下面查看我的代码
这是控制器代码
public ActionResult Index(ConsultantSearch model, int page = 1)
{ const int RecordsPerPage=5;
if (!String.IsNullOrEmpty(model.SearchButton))
{
var consultants = from con in db.Consultants
where (model.ConsultantName == null || con.ConsultantName.Contains(model.ConsultantName)) && (model.CompanyID == null || con.CompanyID == model.CompanyID)
&& (model.ClientID == null || con.ClientID == model.ClientID) && (model.VendorID == null || con.VendorID == model.VendorID) && (model.RecruiterID == null || con.RecruiterID == model.RecruiterID)
&& (model.Class == null || con.Class == model.Class) && (model.W2_1099 == null || con.W2_1099 == model.W2_1099) && (model.IsActive == null || con.IsActive == model.IsActive)
select con;
consultants = consultants.Include(c => c.Client).Include(c => c.Company).Include(c => c.Recruiter).Include(c => c.SalesPerson).Include(c => c.Vendor);
return PartialView("_ConsultantList",consultants.ToList().ToPagedList(page,RecordsPerPage));
}
else
{
var consultants = db.Consultants.Include(c => c.Client).Include(c => c.Company).Include(c => c.Recruiter).Include(c => c.SalesPerson).Include(c => c.Vendor);
return View(consultants.ToList().ToPagedList(page, RecordsPerPage));
}
}
实现分页的部分视图是
@model PagedList.IPagedList<ArthurLawrenceKPI.Models.DatabaseModels.Consultant>
<div id="consultantSearchResults">
<div class"pagedList" data-al-target="#consultantSearchResults">
@Html.PagedListPager(Model, page => Url.Action("Index",new{ page} ),
PagedListRenderOptions.MinimalWithItemCountText)
</div>
<table>
<tr>
<th>
@Html.DisplayNameFor(model => model.First().ConsultantName)
</th>
<th>
@Html.DisplayNameFor(model => model.First().EmailAddress)
</th>
</tr>
@foreach (var item in Model)
{
<tr>
<td>
@Html.DisplayFor(modelItem => item.ConsultantName)
</td>
<td>
@Html.DisplayFor(modelItem => item.EmailAddress)
</td>
<td>
@Html.ActionLink("Edit", "Edit", new { id = item.ConsultantID }) |
@Html.ActionLink("Details", "Details", new { id = item.ConsultantID }) |
@Html.ActionLink("Delete", "Delete", new { id = item.ConsultantID })
</td>
</tr>
}
</table>
最后,这是我的 javascrpt 文件,其中包含使分页机制异步的代码。我已将此 js 文件和其他相关的 .js 文件包含在 bundle.config 中的一个包中,并将它们包含在 _Layout 中。
$(function () {
var getPage = function () {
var $a = $(this);
var options = {
url: $a.attr("href"),
data: $("form").serialize(),
type: "get"
};
$.ajax(options).done(function (data) {
var target = $a.parents("div.pagedList").attr("data-otf-target");
$(target).replaceWith(data);
});
return false;
};
$(".main-content").on("click", ".pagedList a", getPage);
});