刷新mvc中的视图

时间:2015-01-30 05:23:50

标签: javascript c# jquery asp.net asp.net-mvc

任何人都可以告诉我为什么这个代码图片不会每1秒刷新一次视图

 <div id="AutoRefresh">
<table class="table">
    <tr>
        <th>
            @Html.DisplayNameFor(model => model.Employees.Name)
        </th>
        <th>
            @Html.DisplayNameFor(model => model.RequestTypes.RequestTypeName)
        </th>
        <th>
            @Html.DisplayNameFor(model => model.Comments)
        </th>
        <th>
            @Html.DisplayNameFor(model => model.Inserted_Date)
        </th>

        <th>Action</th>
    </tr>

    @foreach (var item in Model)
    {
        <tr>
            <td>
                @Html.DisplayFor(modelItem => item.Employees.Name)
            </td>
            <td>
                @Html.DisplayFor(modelItem => item.RequestTypes.RequestTypeName)
            </td>
            <td>
                @Html.DisplayFor(modelItem => item.Comments)
            </td>
            <td>
                @Html.DisplayFor(modelItem => item.Inserted_Date)
            </td>

            <td>
                @Html.ActionLink("Edit", "Edit", new { id = item.Id }) |
                @Html.ActionLink("Details", "Details", new { id = item.Id }) |
                @Html.ActionLink("Delete", "Delete", new { id = item.Id })
            </td>
        </tr>
    }

</table>

@section Scripts {
<script type="text/javascript">
    $(function () {
        setInterval(function () { $('#AutoRefresh').load('/RequestApprovals/Index'); }, 1000); // every 1 sec
    });
</script>

}

控制器操作方法:

 // GET: RequestApprovals
    public async Task<ActionResult> Index()
    {
        var requestApprovals = db.RequestApprovals.Include(r => r.Employees).Include(r => r.RequestTypes);
        return View(await requestApprovals.ToListAsync());
    }

我的共享文件夹中有一个_Layout.cshtml文件,如果我在布局页面中使用元标记,它会刷新使用该_Layout.cshtml的所有视图,但我想只有一个包含上述代码的视图应该刷新。我试过上面的代码,但它不适合我。请建议我应该怎么做?

1 个答案:

答案 0 :(得分:-1)

您可以使用Ajax调用来刷新页面数据:

<script src="Scripts/jquery-1.4.1.js" type="text/javascript"></script>
<script id="sessionJs" type="text/javascript">

   function GetData()
       {
              $.ajax(
              {
                   type: "POST",
                   url: "RequestApprovals/Index",
                   data: "{'value':'" + value + "'}",
                   contentType: "application/json; charset=utf-8", 
                   dataType: "json",
                   failure: function (msg) { alert(msg); },
                   success: function (msg) { alert(msg.d);  } 
                    }
                );
            }
       }
    setTimeout(GetData, 1000);
</script>

或者您也可以尝试使用:

initialize: function() {
    this.timer = setInterval(function() {
    this.collection.fetch();
   }, 1000);
},
close: function() {
    clearInterval(this.timer);
}