Question

我在我的页面上有一个操作，然后需要3个长（每个几秒）操作串行执行。在执行每个操作之后，我希望控制器返回部分视图并使页面更新具有状态（让用户知情，我发现如果人们知道发生的事情他们担心的话）。有没有一种MVC“方式”这样做，或者我应该只使用jQuery来做到这一点？

感谢。

Answer 1

您将需要使用jQuery对三个单独的控制方法发出三个单独的调用，并在单独返回时更新页面的三个区域。

“捆绑”调用的唯一方法是将它们全部合并为一个，但是在返回多个调用时，你无法获得返回给客户端的返回值（几乎就像流式传输一样，没有什么可以监听的返回第一个结果集后，客户端结束，该连接已关闭。

Answer 2

所以我创造了一个轻微的黑客，似乎有效：

在客户端，我有：

function onClickHandler() {
    updateUI("Beginning Batch...");
    setTimeout(klugeyClick, 0);
}

function klugeyClick() {
    $.ajax({ type: "GET", dataType: "json", url: "/ControllerName/Action1", success: function(msg) { updateUI(msg) }, async: false, error: function(XMLHttpRequest, textStatus, errorThrown) { updateUI("Action1 Error: " + XMLHttpRequest + " -- " + textStatus + " ---- " + errorThrown); } });
    setTimeout(klugeyClick2, 0);
}

function klugeyClick2() {
    $.ajax({ type: "GET", dataType: "json", url: "/ControllerName/Action2", success: function(msg) { updateUI(msg) }, async: false, error: function(XMLHttpRequest, textStatus, errorThrown) { updateUI("Action2 Error: " + XMLHttpRequest + " -- " + textStatus + " ---- " + errorThrown); } });
    setTimeout(klugeyClick3, 0);
}

function klugeyClick3() {
    $.ajax({ type: "GET", dataType: "json", url: "/ControllerName/Action3", success: function(msg) { updateUI(msg) }, async: false, error: function(XMLHttpRequest, textStatus, errorThrown) { updateUI("Action3 Error: " + XMLHttpRequest + " -- " + textStatus + " ---- " + errorThrown); } });
}

function updateUI(result) {
    $("#UIelement").text(result);
}

在服务器端，我有：

Function Action1() As JsonResult
    System.Threading.Thread.Sleep(3000)
    Return Json("Operation One Complete...")
End Function

Function Action2() As JsonResult
    System.Threading.Thread.Sleep(3000)
    Return Json("Operation Two Complete...")
End Function

Function Action3() As JsonResult
    System.Threading.Thread.Sleep(3000)
    Return Json("Operation Three Complete...")
End Function

现在我有两个问题。首先，我想有一个显示“Batch Complete”的后续消息但是遵循相同的模式，只是添加另一个'klugeyClick'并调用UpdateUI（带或不带seTimeout）会导致上一条操作消息不显示。我认为jQuery.ajax方法中的回调使得这个kluge以某种方式工作但没有ajax调用，我不能放任何后续消息。

接下来的问题是虽然我的所有调用都进入了我的webservice并且正在返回json结果，但我总是从jQuery回调中得到一个错误。任何想法为什么会这样？

感谢。

Answer 3

“kludgy”解决方案有效的原因是setTimeout()方法创建了一个事件。因此，你的逻辑是：

更新用户界面
第1步的设置事件：
1. 开始“ajax”致电
2. 等待“ajax”完成
3. 第2步的设置事件
  1. 开始“ajax”致电
  2. 等待“ajax”完成
  3. 第3步的设置事件
    1. 开始“ajax”致电

这正是ajax()的回调功能。

function Step1() {
    $.ajax({ 
        type: "GET", 
        dataType: "json", 
        url: "/ControllerName/Action1", 
        success: function(msg) { 
            updateUI(msg);
            Step2(); // call step 2 here!
        }, 
        async: true, // don't block the UI
        error: function(XMLHttpRequest, textStatus, errorThrown) { 
            updateUI("Action1 Error: " + XMLHttpRequest + " -- " + textStatus + " ---- " + errorThrown); 
        } 
    });
}
function Step2() {
    // similar to step one
}

Answer 4

据我所知，让跟踪消息以我想要的方式显示的唯一方法（即我上次操作后的几秒钟）就是有一个虚拟的web服务方法，我称之为返回延迟后的最后一条消息...... crumby。

现在我的最后一个问题是我对jsonResult操作的所有调用都返回给客户端的textStatus为'error'。现在根据文档这意味着一个http错误，但是如果在服务器端正确调用该方法并且生成了Json结果（通过在服务器上设置断点来验证），怎么会出现http错误？

Answer 5

对于我们的网站，我们有大操作，需要一些时间。该动作由子动作组成，我们聚合结果并构建一个很好的视图。

一年前：

我们按顺序执行此操作：action1，action2等。
我们有一个典型的页面：请稍等。

可以帮助你的技巧：

我们在服务器端执行并行请求。
我们在结果页面中等待结果。 javascript需要一些时间来加载，所以当服务器搜索时，我们加载页面。
我们每秒都询问服务器：你完成了吗？随着不同的行动完成，我们得到了部分结果。

我不知道你是否可以将所有这些东西都应用到你的问题中，但其中一些可能非常好。

我们不使用MVC，我们使用jQuery和ajax的一些asmx服务。

MVC2一个异步调用，多个异步更新

5 个答案: