如何自动更新局部视图? [英] How can I automatically update a partial view?

问题描述

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

I'm trying to convert one of my MVC pages so that it automatically updates the data every 10 seconds. Here is the method that calls the "main" view.

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

这是SomeView

Here is SomeView

@Html.Partial("SomeView",Model)

部分视图消耗了模型

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

现在如何将所有这些连接起来，以便局部视图自动刷新?有很多(看来已经过时的)方法可以做到这一点，我想遵循当前的最佳实践.我的研究告诉我，我应该使用jquery不引人注目的ajax来做到这一点.

Now how do I wire this all up so that the partial view automatically refreshes? There is a lot of (what appears to be outdated) methods of ahceiving this, and I want to follow the current best practice. My research is telling me I should be using jquery unobtrusive ajax to do this.

推荐答案

您的问题含糊不清/广泛，因此您很可能会得到含糊不清/广泛的答案.

Your question is vague/broad, so you will likely get vague/broad answers.

如果您需要代码示例，那么我建议您提供您尝试过的代码，以便我们进行修复.堆栈溢出通常不是一个好地方我怎么做这个复杂的事情?给我看代码."有很多可能的解决方案.

If you want code examples then I recommend you provide code you've tried so that we can fix it. Stack Overflow is generally not a good place to go "How do I do this complex thing? Show me the code." There are many possible solutions.

我将向您展示三种(可能很多)可能的技术.

I'm going to show you three of the (probably many) possible techniques.

• 难度::我认为对于新手来说这是多么困难.
• 耐用性 :(可能是一个不好的名字)维护/扩展/修改的容易程度.它的可重用性和对 SOLID 的粗略估算. li>

• Difficulty: How difficult I think it is for someone new to the technique.
• Durability: (Probably a bad name) How easy it is to maintain/extend/modify. How reusable it is and a rough estimation of how SOLID it is.

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

SignalR is a .NET library that is ideal for integrating into ASP.NET MVC applications. It allows you to send information from server-side code to a client or clients in real-time. This would meant that a section of a page would not refresh based on time, but rather on some arbitrary event.

此技术在现代，复杂的Web应用程序(例如Facebook)中非常流行.在这样的示例中，当新数据传入时，页面通常会进行次刷新或更新.

This technique is very popular in modern, complex web applications such as Facebook. In such examples, pages will often do minor-refreshes or updates when new data is incoming.

Javascript已经具有 setInterval()函数.只需为该函数提供一个回调和一个超时时间(以毫秒为单位)作为参数，它将每X毫秒调用一次函数.

Javascript already has a setInterval() function. Simply give this function a callback and a timeout period (in milliseconds) as arguments and it will call your function every X milliseconds.

您可以将其与 jQuery的

You can use this in conjunction with jQuery's AJAX API so that every X seconds, jQuery will call an MVC partial view asynchronously and replace a section of the page with the specified partial view. For example:

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

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

难度:中等，耐久性:高

Web应用程序框架，例如 AngularJS (我的选择)， Backbone .js ，淘汰等都是通过jQuery实现此目标的更好方法.基本思想类似于jQuery，但解决方案更强大.

3. Use a web application Javascript framework

Difficulty: Medium, Durability: High

Web application frameworks such as AngularJS (my choice), Backbone.js, Knockout and so on are much better ways to achieve this goal over jQuery. The basic idea is similar to jQuery but the solution is more robust.

您将需要创建逻辑(通常在视图模型或控制器中)，该逻辑将负责将某些任意数据(例如部分视图的HTML)与用户页面上的内容进行同步.计时器很容易做到这一点-计时器通常包含在框架中.

You would need to create logic (usually in a view-model or controller) that will be responsible for synchronising some arbitrary data (such as HTML from a partial view) with what is on the user's page. This can easily be done with timers - which are often included in the framework.

这篇关于如何自动更新局部视图?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！