Question

我正在使用Kendo + razor，我想创建一个没有任何特定数据模型的Kendo网格（在我的情况下，我必须显示由用户输入的SQL查询的结果，因此结果可以有任何数量/类型的列）。为了使它通用我尝试将网格绑定到System.data.DataTable和ajax调用以填充该网格。它在第一次加载时工作正常，但是当我重新填充相同的网格时，它不会更新其列名。

方案：
在单击按钮时进行Ajax调用，以使用查询结果填充网格。在第一个ajax调用时，结果是一个带有属性id，name和description的JSON。网格显示正确的数据与上面提到的3列和4行在第二个ajax调用响应JSON包含属性UserName，UserType，Address，PhoneNumber，这次网格不更新其模型绑定，并且列保留前三列id，name和description但行数更新为no其中的数据（因为返回的JSON中不存在列）

我想将列重新绑定到每次都不同的返回JSON属性。

这是我的HTML代码：

@model System.Data.DataTable
<div>
@(Html.Kendo().Grid(Model)
.Name("ResultsGrid") 
.TableHtmlAttributes(new { Class = "kendoGrid" })
)
</div>

和按钮上的Javascript点击代码：

function execute() {
 $.ajax({
 url: "something something",
 type: "GET",
 contentType: "application/json;charset=utf-8",
 data: "",
 dataType: "json",
 success: function (data) {
        $("#ResultsGrid").kendoGrid({
              scrollable: false,
              pageable: true,
              sortable: true,
              resizable: true,
              dataSource: {
                        data: data,
                        pageSize: 5
                    }
                });
 }
}

如何刷新网格以将列绑定到新的JSON属性？

Answer 1

首先需要销毁旧网格，然后创建一个新网格：

success: function(data) {
    // get reference to the grid instance
    var grid = $("#ResultsGrid").data("kendoGrid");
    // destroy it
    grid.destroy();
    $("#ResultsGrid")
        .empty() // clear the old HTML
        .kendoGrid( {
           dataSource: {
              data: data,
              pageSize: 5
           }
        });

}

Answer 2

success: function(data) {
// get reference to the grid instance
var grid = $("#ResultsGrid").data("kendoGrid");
// destroy it
grid.destroy();
$("#ResultsGrid")
    .empty() // clear the old HTML
    .kendoGrid( {
       dataSource: {
          data: data,
          pageSize: 5
       }
    });

}

如何将Kendo网格绑定到动态数据表

2 个答案: