3

我正在使用 ASP.NET MVC 3 开发一个网站。

我有很多部分包含来自不同部门的新闻，如下图所示：

http://i.stack.imgur.com/G21qi.png

这些部分通过使用添加到母版页

@Html.Action("_News", "Home", new { id = 1 })

其中 id 1 =“Ledelsen”，2 =“Omstillingen”等等。

我的控制器包含以下操作：

[ChildActionOnly]
public ActionResult _News(int id)
{
    // controller logic to fetch correct data from database
    return PartialView();
}

我启动并运行了 CRUD，但我的问题是如何以设定的时间间隔刷新 PartialViews 而无需回发？

我猜我必须使用 Javascript/jQuery 来完成此操作，但我无法做到。

谁能指出我正确的方向或更好的方向，提供一个如何做到这一点的例子？

提前致谢

编辑：只是为了澄清我不希望整个页面刷新，而只对部分视图进行异步刷新

4

2 回答 2

8

在您的部分观点中，我建议将整个内容包装在一个 div 中：

<div id="partial1">

在 javascript 中，您需要一个函数来使用 AJAX 将部分视图加载到 div 中：

$("#partial1").load("_News", { id="1"} );

那是使用 jQuery。这里有一些文档。基本上，这将替换由调用 _News 操作生成的视图指示的 div。如果您向 javascript 调用添加一些逻辑，则 id 可以改变。

然后将调用包装load()在 a 中setTimeout()：

var t = setTimeout(function () {$("#partial1").load("_News", { id="1"} );}, 60000);

这将每 60 秒运行一次包含的函数。t可以使用，因此clearTimeout(t)可以在您的 javascript 代码中的任何位置停止自动刷新。

编辑

这应该解决缓存问题。感谢@iko 的建议。我注意到你需要cache: false这个工作。

var t = setTimeout(function () { $.ajax({ 
                                     url: "_News", 
                                     data: { "id": "1" }, 
                                     type: "POST", 
                                     cache: false, 
                                     success: function (data) { 
                                          $("#partial1").innerHTML = data; 
                                     }}); }, 60000);
于 2011-05-29T23:35:31.173 回答
0

我将向您推荐我在 Razor (mvc 3) 中对相关问题“UpdatePanel”给出的答案作为起点。请注意，它与史蒂夫马洛里的回答没有什么不同，但强调了其他一些观点。

然而不同之处在于，[ChildActionOnly]如果您想单独更新每个局部视图（仅更新 id 1 或仅更新 id 2），则可能需要删除该属性。

这个脚本可以放在返回的部分中。

<script type="text/javascript">
    setInterval(function()
    {
          $.load('<%= Url.Action("_News", "Home", new { id = Model.Id } ) %>', function(data) {
          $('#partial_'@(Model.Id)').html(data);
      });
    }
    , 30000);
</script>

<div id="partial_@(Model.Id)" />
于 2011-05-30T06:37:50.230 回答