如何在 MVC 4 中每 3 秒刷新一次局部视图？答案

【问题标题】：How do I refresh a partial view every 3 seconds in MVC 4?如何在 MVC 4 中每 3 秒刷新一次局部视图？
【发布时间】：2015-04-21 05:25:21
【问题描述】：

我需要根据已完成的作业数量来更新进度条。完成的作业数存储在 SQL Server DB 的作业表中。我需要我的 ASP.NET MVC 4 应用程序每 3 秒查询一次数据库，以了解竞争的作业数量，并使用此数据更新部分视图中的进度条。计时器工作，它调用我在StatusController 中的_getforStatus 操作，它似乎调用了EntityDB，但似乎从来没有在定时器告诉它之前调用视图。如何让进度条每 3 秒刷新一次？

我的 _Layout.cshtml 视图的标题调用了 StatusController 中的计时器的启动，如下所示：

 <head>
      ...
       @Html.Action("InitTimer", 'Status")
      ...
 </head>

另外，在 _Layout 视图中，我将部分视图称为 Jumbotron，如下所示：

 <div class="jumbotron" id=progress">
      @{Html.RenderAction("_GetforStatus", "Status");}
 </div>

Status 控制器的编码如下：

 public class StatusController : Controller
 {
      IntegrationDBEntities _db;

      Private Timer timer1;

      Public void initTimer()
      {
           timer1 = new Timer();
           timer1.elapsed += new ElapsedEventhandler(timer_Elapsed(;
           timer1.interval = 3000;
           timer1.Start();
       }

      Private void timer_Elapsed(Object sender, EventArgs e)
      {
           _GetforStatus();
      }

      [ChildActiononly]
      public PartialViewResult _GetforStatus(0
      {
           _db = new IntegrationDBEntities();
           ViewDataModel - _db.Jobs.ToList();
           return partialView();
      }

编辑：我还尝试了以下 Ajax 代码。我没有收到任何错误，但我的进度条从未更新：

 <script>
       function loadPartialView()  {
            $.ajax({
                 url:  '@url.Action("_GetforStatus', "Status")",
                 type:  'GET',
                 dataType:  'html',
                 success: function(result)  {
                      $('progress').html(result);
                 }
            });
        }

  $function () {  
       loadPartialView();
       window.setInterval("loadPartialView()", 3000);
  });
 </script>

我不确定它是否不起作用，因为我没有在 JS 中正确表示“Html.RenderAction”或什么。

【问题讨论】：

对于这样的事情，我更喜欢在视图sitepoint.com/settimeout-example 上使用 jquery 计时器。在计时器中执行 ajax 调用以返回部分或仅返回更新进度条所需的数据
我尝试关注另一个问题，该问题为类似问题提供了 Ajax 解决方案，但我无法让它工作。您能否使用上面的代码向我展示一个示例，说明我将如何使用 razor 语法来实现这一点？
您能否发布您尝试使用 ajax 调用的内容并告诉我您遇到了什么错误？
看起来好像它没有调用脚本。我是否必须在头脑中编写任何代码才能读取它？

标签： asp.net-mvc-4 timer progress-bar entity-framework-6 asp.net-mvc-partialview

【解决方案1】：

我认为您需要对 ajax 调用进行一些更改。这是我如何拨打电话的示例

$.ajax({
    url: '@Url.Action("Action", "Controller")',
    type: 'post',
    cache: false,
    async: true,
    data: { id: "frmUser" },
    success: function(result){
        $('.divPartial').html(result);
    } 
});

在您的控制器上，我认为您不仅仅需要子操作。您还返回一个空的局部视图对象。应该是

return partialView('_partialName', Model);

最后，在您的 jquery 中，您需要重新触发呼叫以保持呼叫发生。试试这样的

$(document).ready(function(){
    function RefreshPartial(){
        //this will wait 3 seconds and then fire the load partial function
        setTimeout(function(){
            loadPartialView();
            //recall this function so that it will continue to loop
            RefreshPartial();
        }, 3000);
    }
    //initialize the loop
    RefreshPartial();
});

【讨论】：

我是把脚本标签放在它周围，还是有办法在Razor里写？
还有，什么是“.divpartial”和“frmUser”？
是的，这将进入您的脚本标签。这只是一个例子。如果您想将某些内容传递回控制器，您可以通过 data 属性来完成。如果您不想这样做，可以删除该属性。 div partial 是表单上元素的选择器（如 div），返回的局部视图将被放置在其中。
如果您在浏览器上查看控制台，您是否遇到错误？你能在代码中放一个断点并确保它被命中吗？要将模型传递给局部，您可以将它传递到那里。如果您没有模型，请不要使用它
您的视图没有看到它。查看您视图中的源代码并确保引用存在并确保链接中的 url 有效