0

我无法使分页异步。我正在使用 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);

});

4

1 回答 1

0

我在我的 Javascript 代码中发现了错误。以下代码中有错字

$.ajax(options).done(function (data) {
    var target = $a.parents("div.pagedList").attr("data-otf-target");
    $(target).replaceWith(data);
});
return false;

“data-otf-target”应该是“data-AL-target”。用以下代码替换上面的代码

$.ajax(options).done(function (data) {
    var target = $a.parents("div.pagedList").attr("data-AL-target");
    $(target).replaceWith(data);
});
return false;

并在控制器的 If 子句中添加一个条件,一切都很好:)

if (!String.IsNullOrEmpty(model.SearchButton) || Request.IsAjaxRequest())
于 2013-06-13T17:08:33.587 回答