Model view controller MVC2一个异步调用,多个异步更新

Model view controller MVC2一个异步调用,多个异步更新,model-view-controller,asynchronous,multiple-results,Model View Controller,Asynchronous,Multiple Results,我在我的页面上有一个操作,每个操作需要3秒长的时间来串联执行。但是,在执行每个操作之后,我希望控制器返回一个局部视图,并让页面更新状态保持通知用户,我发现如果人们知道正在发生的事情,他们就不那么担心了。有没有MVC的“方法”可以做到这一点,或者我应该使用jQuery来实现这一点 谢谢。您需要使用jQuery对三个单独的控件方法发出三个单独的调用,并在分别返回时更新页面的三个区域 聚合调用的唯一方法是将所有调用合并为一个,但您无法在返回多个调用时将返回值发送回客户端,就像流媒体一样,在您返回第一个

我在我的页面上有一个操作,每个操作需要3秒长的时间来串联执行。但是,在执行每个操作之后,我希望控制器返回一个局部视图,并让页面更新状态保持通知用户,我发现如果人们知道正在发生的事情,他们就不那么担心了。有没有MVC的“方法”可以做到这一点,或者我应该使用jQuery来实现这一点


谢谢。

您需要使用jQuery对三个单独的控件方法发出三个单独的调用,并在分别返回时更新页面的三个区域


聚合调用的唯一方法是将所有调用合并为一个,但您无法在返回多个调用时将返回值发送回客户端,就像流媒体一样,在您返回第一个结果集后,客户端上没有任何内容可供侦听,该连接已关闭。

因此我创建了一个小技巧,这似乎奏效了:

在客户端,我有:

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
在服务器端,我有:

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(带或不带SetTimeout),就会导致不显示最后一条操作消息。我认为jQuery.ajax方法中的回调使这个kluge能够以某种方式工作,但是如果没有ajax调用,我就不能发出任何后续消息

下一个问题是,尽管我的所有调用都访问了我的Web服务,并且返回的json结果都很好,但我总是从jQuery回调返回一个错误。你知道为什么会这样吗


谢谢。

您的Kludge解决方案之所以有效,是因为setTimeout方法创建了一个事件。因此,你的逻辑是:

更新用户界面 步骤1的设置事件: 启动ajax调用 等待ajax完成 步骤2的设置事件 启动ajax调用 等待ajax完成 步骤3的设置事件 启动ajax调用 这正是ajax回调特性的用途


因此,据我所知,获得后续消息以我希望的方式显示的唯一方法,即在我上次操作后几秒钟,是调用一个虚拟webservice方法,在延迟后返回最后一条消息。。。易碎的

现在我的最后一个问题是,我对我的jsonResult操作的所有调用返回到客户端时都带有一个“error”的textStatus。现在,根据文档,这意味着http错误,但是如果在服务器端正确调用该方法并通过在服务器上设置断点来验证Json结果,那么怎么会有http错误呢?

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

一年前:

我们是按顺序做的:动作1,然后是动作2,等等。 我们有一个典型的页面:请稍等。 可以帮助您的技巧:

我们在服务器端执行并行请求。 我们在结果页面中等待结果。那里的javascript需要一些时间来加载,所以当服务器搜索时,我们加载页面。 我们每秒钟都会问服务器:您完成了吗?当不同的动作完成时,我们得到部分结果。 我不知道你是否能把所有这些东西都应用到你的问题上,但其中一些真的很好


我们不使用MVC,我们在jQuery和ajax中使用一些asmx服务。

我在循环运行了一段时间后得出了这个结论,但是现在这给我带来了一个不同的问题。IE很愚蠢,因为它不会更新UI,也不会在运行Javascript时给您强制更新的选项。因此,当我尝试进行3次同步JQuery.ajax调用时,我的UI被冻结,直到所有调用都完成。现在这个网站上的其他帖子说解决方案是使操作异步,但是嗯。。。如果顺序不重要,我就不会使用同步。。。有什么想法吗?@BitFiddler:jQuery上对ajax方法的调用是自动的,因为您提供的是回调,对吗?。如果您看到屏幕冻结,那么我猜是UI更新阻塞了,而不是异步调用。不,这些调用不是异步的。我需要它们以特定的顺序发生我正在使用的系统是独立的,但相互依赖。。。不要让我开始。因此,在所有脚本都运行完毕之前,IE似乎不会更新其DOM,这是我的问题:-但如果我将这些异步ajax调用中的3个串在一起,调用是否总是按顺序返回?我刚刚测试了它,如果我使用您的解决方案,它将无法按预期工作。当Async设置为true时,它们将无序到达,在我的解决方案中,它们不会无序到达。本质上,我是在等待响应时解锁接口,以便更新它。。。这就是我想要的。然而,如果不在最后对某个虚拟webservice方法进行另一个Ajax调用,我就不能再次使用这个技巧来说明整个batc
h完成了。此外,由于某些原因,结果仍然无法成功返回。它们将始终以正确的顺序依次启动,因为只有在步骤1成功完成后,才会调用步骤2。我不会再打电话只是为了得到完整的信息。以某种方式将其标记在第三条消息的末尾。i、 第三次行动完成。。。成批完成乔尔,你说得对。因此,这简化了我的代码,但无助于在最后显示一条消息,即batch complete,我尝试添加一个:setTimeoutupdateUIFINISHED,3000;在最后一步中,但这会导致跳过最后一个服务调用的结果。另外,你知道为什么json调用总是作为未知错误返回吗?javascript没有线程。这是setTimeout的第一个错误。你有事件和你自己,但在给定的时间只有一个代码线程在运行。最后一个问题是与json和“get”操作有关的。显然,需要在某个地方设置一些设置,以允许这种情况,但它似乎不受开箱即用的支持。我刚改用Post,一切都很顺利。