【问题标题】：How can I automatically update a partial view?如何自动更新局部视图？
【发布时间】：2014-03-24 23:14:19
【问题描述】：

我正在尝试转换我的一个 MVC 页面，以便它每 10 秒自动更新一次数据。这是调用“主”视图的方法。

    public ActionResult Index()
    {
        return View("SomeView", new SomeViewModel { Rows = GetSomeInfo() });
    }

这里是一些视图

@Html.Partial("SomeView",Model)

局部视图消耗模型

@model DatabaseConnectionMonitor.Models.TestDbModel
@foreach(var row in @Model.Rows)......

现在我如何将这一切连接起来以使局部视图自动刷新？有很多（似乎已经过时的）方法可以实现这一点，我想遵循当前的最佳实践。我的研究告诉我我应该使用 jquery unobtrusive ajax 来做到这一点。

【问题讨论】：

您可以在计时器上进行 AJAX 调用，或者使用 SignalR 之类的东西在发生变化时通知视图。
我想从数据源中提取信息并将其显示在部分视图中。想想一个在计时器上自动更新的股票监视器
是的，我上面给出的选项是你最好的选择恕我直言。我个人大量使用 jQuery AJAX 调用来满足这类需求。
有机会提供 AJAX 计时器的示例吗？

标签： jquery asp.net-mvc

【解决方案1】：

您的问题是模糊/广泛的，因此您可能会得到模糊/广泛的答案。

如果您需要代码示例，那么我建议您提供您尝试过的代码，以便我们修复它。 Stack Overflow 通常不是一个好去处“我该如何做这个复杂的事情？给我看代码。”有很多可能的解决方案。

我将向您展示三种（可能很多）可能的技术。

难度：我认为对于刚接触这项技术的人来说有多困难。
耐用性：（可能是个坏名字）维护/扩展/修改有多容易。它的可重用性和对SOLID 的粗略估计。

1。使用 SignalR

难度：高，耐久性：高

SignalR 是一个 .NET 库，非常适合集成到 ASP.NET MVC 应用程序中。它允许您将信息从服务器端代码实时发送到一个或多个客户端。这意味着页面的一部分将不会根据时间刷新，而是根据任意事件刷新。

这种技术在 Facebook 等现代复杂的 Web 应用程序中非常流行。在此类示例中，页面通常会在新数据传入时进行次要刷新或更新。

2。使用 Javascript 和 jQuery

难度：低，耐久性：低

Javascript 已经有一个setInterval() 函数。只需给这个函数一个回调和一个超时时间（以毫秒为单位）作为参数，它就会每 X 毫秒调用一次你的函数。

您可以将它与jQuery's AJAX API 结合使用，这样每X 秒，jQuery 就会异步调用一个MVC 局部视图，并用指定的局部视图替换页面的一部分。例如：

setInterval(function() {
    $.ajax({
        url: "@Url.Action("Action", Controller)"
    }).success(function(data) {
        $("#someElement").html(data);
    });
}, 10000);

3。使用 Web 应用程序 Javascript 框架

难度：中等，持久性：高

Web application frameworks 例如AngularJS（我的选择）、Backbone.js、Knockout 等是比 jQuery 实现这一目标的更好方法。基本思想与jQuery类似，但解决方案更健壮。

您需要创建逻辑（通常在视图模型或控制器中），负责将一些任意数据（例如部分视图中的 HTML）与用户页面上的内容同步。这可以通过计时器轻松完成 - 通常包含在框架中。

【讨论】：

+1 罗文 - 您以非常优雅和简单的方式回答了一系列选项。对于一个模糊的问题，这是一个很好的答案。
从我在网上看到的示例中，除了 SignalR codeproject.com/Articles/322154/… 和 jacerhea.wordpress.com/2012/09/01/…，他们还使用了这些 MVVM 框架的组合，例如，db 上的值变化如何反映什么用户 a、b、c 使用方法 3 在没有 SignalR 的情况下查看？

【解决方案2】：

我个人使用 jQuery AJAX 调用来满足这种类型的需求。它允许您在不刷新页面的情况下从服务器查询新数据。

这篇文章中接受的答案是一个很好的存根，可以帮助您入门： jQuery/AJAX call with a timer

转载代码方便查看：

$("button").click(function refreshText(){
    $.ajax({
        url:"http://127.0.0.1:8080/",
        success:function(result){
            $("#text").val(result);
            setTimeout(refreshText, 5000);
        }
    });
});

另外一个选项是 SignalR，它可以将更新推送到客户端，但它涉及更多：http://signalr.net

【讨论】：