Question

我有一个ViewModel List的视图，它基于我数据库中的数据。我提出了这个列表，但是我希望在给定的时间间隔（5秒）内刷新列表，因为数据库中的数据会发生变化。我的控制器中有一个更新ViewModel的Action。我使用MVC 3和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 ..你可以使用$ .ajax（）方法从服务器获取新列表并在客户端更新所有视图。

如果您可以共享您的代码，我可以进一步扩展它。

刷新视图模型间隔mvc

2 个答案: