刷新intervals上的视图模型

Question

我有一个带有ViewModels列表的视图，它基于我的数据库中的数据。我提供了这个列表，但我希望该列表在数据库中的数据发生变化时以给定的时间间隔(5秒)刷新。我的控制器中有一个更新ViewModels的操作。我使用MVC3和Razor。我想需要一些JavaScript/jQuery。

我的脚本：

<script type="text/javascript">
$(document).ready(function () {
    var hdRaceId = $("#hdRaceId");

    setInterval("GetList()", 5000);
    function GetList() {
        $.get("/Timer/Update/?id=" + hdRaceId.val());
    }

​

我在控制器中的操作：

        public ActionResult Update(int id)
    {
        var raceintermediates = RaceIntermediateModel.GetRaceintermediatesForRace(id);
        return View("Speaker", raceintermediates);
    }

Answer 1

如果您想刷新DOM的某一部分，则需要为AJAX请求定义一个成功的回调。如下所示：

window.setInterval(function() {
    var hdRaceId = $('#hdRaceId').val(); 
    var updateUrl = '@Url.Action("Update", "Timer")';
    $.get(updateUrl, { id: hdRaceId }, function(result) {
        $('#someDivId').html(result);
    });
}, 5000);

其中，您有一些div将托管部分视图结果：

<div id="someDivId"></div>

还有一些浏览器，比如IE，可能会缓存GET请求。为了避免这种情况，您可以使用以下命令：

window.setInterval(function() {
    var hdRaceId = $('#hdRaceId').val(); 
    var updateUrl = '@Url.Action("Update", "Timer")';
    $.ajax({
        url: updateUrl,
        type: 'GET',
        data: { id: hdRaceId }, 
        cache: false,
        success: function(result) {
            $('#someDivId').html(result);
        }
    });
}, 5000);

Answer 2

setTimeout(GetRefereshedList，5000)；

在GetRefreshedList中，..you可以使用$.ajax()方法从服务器获取新的列表，并在客户端更新所有视图。

如果你能分享你的代码，我可以再扩展一下。