如何在不重新加载整个页面的情况下刷新局部视图内的剑道 ui 网格？

Question

早安，

我很难刷新放置在局部视图内的剑道网格。看看我目前在局部视图中使用的代码：

@model IEnumerable<TelerikMvcAscernAdmin2.Models.ConnectionViewModel>
@(Html.Kendo().Grid(Model).Name("id").Sortable().Columns(c =>  {
  c.Bound(p => p.SystemId);
  c.Bound(p => p.Host);
  c.Bound(p => p.Port);})
  .DataSource(datasoure =>datasoure.Server().PageSize(25).Sort(sort=>{sort.Add(c => c.Host).Ascending(); })
                  ).Filterable()
  .Pageable(p => p.PageSizes(new int[] { 25, 35, 40 })
        .Refresh(true)).Groupable().Sortable().Scrollable(s => s.Height("200px")).RowAction(row =>   {
  if (row.DataItem.Port == 0) row.HtmlAttributes["style"] = "background:red";  }).HtmlAttributes(new { style = "width: 800px;" }) )

<script>  $(document).ready(function () {
          var refId = setInterval(function () {
          var grid = $("#id").data("kendoGrid");
          grid.dataSource.read();
          }, 40000);
          });   </script>

如您所见，我正在使用服务器端功能，以便自动刷新此网格。我尝试将它切换到 Ajax 函数，但是当我这样做时，我的网格无法刷新。

我在我的 Home 视图中渲染这个局部视图，如下所示：

@Html.Action("EngineConnection", "GatewayConnections")

另外，看看我的动作控制器方法，我将所有数据返回到局部视图：

public ActionResult EngineConnection()
    {
        var gatewayConnections = GatewayConnections.GetAllConnections();
        var agents = Agent.RetrieveAgents();
        var connectionViewModels = (from agent in agents.Where(a => a.Active)
                                    join gatewayConnection in gatewayConnections on agent.SystemId equals gatewayConnection.ClientId into
                                        agentConnections
                                    from agentConnection in agentConnections.DefaultIfEmpty()
                                    select
                                        new ConnectionViewModel
                                        {
                                            SystemId = agent.SystemId,
                                            Host = (agentConnection == null ? string.Empty : agentConnection.Host),
                                            Port = (agentConnection == null ? 0 : agentConnection.Port)
                                        }).ToList();
        return PartialView("_EngineConnection", connectionViewModels);
    }

我已经尝试返回一个 JSON 对象，但这似乎没有奏效。有没有办法只刷新网格而不是整个页面，并且仍然将网格保持在局部视图内？

任何建议都会有所帮助！

谢谢

Answer 1

我建议您按照以下方式绑定网格。

    @(Html.Kendo().Grid<EntityStandardGridModel>()
    .Name("KendoEntityStandardGrid")
    .Columns(columns =>
      {
         //columns
      })
      .Selectable(selectable => selectable.Mode(GridSelectionMode.Single))
      .Sortable(sortable => sortable.AllowUnsort(false))
      .Scrollable(scrollable => scrollable.Virtual(true))
      .Resizable(resizable => resizable.Columns(true))
      .DataSource(dataSource => dataSource
          .Ajax()
          .PageSize(100)
          .Model(model => model.Id(p => p.SearchId))
          .Read(read => read.Action("GetStandardGriddata", "Search", new { SearchId = Model.SearchId }))
        )
     )