Question

我想使用OnComplete，因为我需要在使用Ajax调用中的数据更新视图之前修改视图。正如它在这里所说：MSDN，它应该非常直接。但是，它没有用，经过一些调查后，似乎OnComplete在 OnSucess之前触发了，而在之后触发了。

用于测试的代码：

@{ AjaxOptions options = new AjaxOptions {OnSuccess = "onSuccess", OnComplete = "onComplete", UpdateTargetId = "Update"}; } @Ajax.ActionLink("Hit it", "Action", options) <div id="Update"></div> <script type="text/javascript"> function onSuccess() { alert('onSuccess: ' + $('#Update').html()); } function onComplete() { alert('onComplete ' + $('#Update').html()); } </script> public ContentResult Action() { return Content("Content"); }

我在这里错过了什么，或者是什么？

Answer 1

在您的视图中尝试此操作：

@Ajax.ActionLink("Hit it", "Action", new AjaxOptions() { OnSuccess="done"} )
<div id="Update"></div>

控制器操作：

public ContentResult Action()
{
    return Json(new { content="content" }, JsonRequestBehavior.AllowGet);
}

JavaScript的：

function done(data) {
    var message = data;
    if (typeof message["content"] !== "undefined") {
        $('#Update').html(message["content"]);
    } else {
        alert("error");
    }
}

您可以从您的Controller传递Json结果，并通过JavaScript在View中获取该消息并更新您的div。

Answer 2

问题是UpdateTargetId在触发OnSuccess处理程序之前被执行。

如果要在更新内容之前更新视图或执行额外步骤，请从AjaxOptions中删除updatetargetid并在OnSuccess处理程序中自行处理更新。您将完全控制视图何时更新。

function onSuccess(result, status, xhr)
{
     // put in your view update code here.


     // and then
     $("#Update").html(result);

}

Answer 3

当ajax调用完成且响应数据已实例化但页面尚未更新时，

OnComplete被触发

AjaxOptions OnComplete

3 个答案: