Question

我正在添加一个正常工作的Kendo UI网格，以允许它根据从文本框传入的ID进行更新。我从ajax调用我的控制器，一切都按预期工作，直到我尝试在ajax成功中为我的网格创建kendo.data.DataSource()。 result看起来与预期的一样，但我将其分配给数据源的任何操作似乎都不起作用。数据没有显示任何内容，并且网格显示为空。

网格预期的模型与我的控制器中的模型匹配。我看过其他问题和剑道ui文档，但我似乎无法弄清楚我做错了什么......任何帮助都将受到赞赏。

的Ajax：

$.ajax({
    type: "POST",
    url: '@Url.Action("Search")',
    data: JSON.stringify({ id: id }),
    dataType: "json",
    contentType: "application/json; charset=utf-8",
    success: function (result) {
        var grid = $("#Grid").data("kendoGrid");
        var data = new kendo.data.DataSource(result);
        grid.dataSource.data(data);
        grid.refresh();
    }
});

控制器：

public ActionResult Search([DataSourceRequest]DataSourceRequest request, string id)
{
    IEnumerable<SearchModel> data = GetData(id);

    return Json(data.ToDataSourceResult(request), JsonRequestBehavior.AllowGet);
}

Answer 1

您正在服务器上使用ToDataSourceResult（）扩展方法，因此您需要使用result的Data属性来分配您在客户端上创建的DataSource对象的data属性。此外，您应该使用网格的setDataSource方法而不是grid.dataSource.data（）。最后，您要调用dataSource网格属性的read（）方法，而不是grid.Refresh（）。

$.ajax({
    type: "POST",
    url: '@Url.Action("Search")',
    data: JSON.stringify({ id: id }),
    dataType: "json",
    contentType: "application/json; charset=utf-8",
    success: function (result) {
        var grid = $("#Grid").data("kendoGrid");
        var dataSource = new kendo.data.DataSource({
            data: result.Data
        });
        grid.setDataSource(dataSource);
        grid.dataSource.read();
    }
});

Answer 2

您正在错误地创建DataSource。假设您的AJAX调用的结果返回一个数组，那么您必须将其包装在一个具有data属性的对象中，该属性包含数据数组。

$.ajax({
    // ...
    success: function (result) {
        var grid = $("#Grid").getKendoGrid();
        var data = new kendo.data.DataSource({ data: result });
        grid.dataSource.data(data);
        grid.refresh();
    }
});

以下是创建DataSource并允许传入数组（解包），DataSource配置对象或甚至是预先存在的DataSource对象的替代方法。

var data = kendo.data.DataSource.create(obj);

这种方法更适合b / c它更灵活。

我希望有所帮助！

无法设置Kendo UI Grid DataSource

2 个答案: