javascript - 使用 ajax 回调将数据源绑定(bind)到 Controller 时，数据未显示在 Kendo Grid 上

Question

我的问题有点类似于:

Binding Kendo Data Source with Async $.ajax calling from C# MVC Controller Action

这是创建 Kendo 网格的 javascript:

 $(document).ready(function () {
            $("#grid").kendoGrid({
                dataSource: getData(),
                height: 550,
                groupable: true,
                sortable: true,
                pageable: {
                    refresh: true,
                    pageSizes: true,
                    buttonCount: 10
                },
                columns: [{
                    field: "a",
                    title: "a",
                    width: 200
                }, {
                    field: "a",
                    title: "a"
                }]
            });
        });

这是我用来获取数据的 getData 函数，它是一个 ajax 回调函数，它调用 Controller 中名为 doSearch 的操作

 function getData() {
            jQuery.ajax({
                type: "POST",
                url: "@Url.Action("doSearch")",
                dataType: "json",
                contentType: "application/json; charset=utf-8",
                data: JSON.stringify({ needSearch: true }),
                success: function (data) {
                    var dataSource = new kendo.data.DataSource({
                        data: JSON.parse(data)
                    });
                    dataSource.read();
                    return dataSource;
                },
                failure: function (errMsg) {
                    alert(errMsg);
                }
            });
        }

回调没问题，“数据”有值(value)，但问题是:网格中没有显示数据。

这是数据的返回值:

 [{"a": "First record"},{"a": "Second record"}]

代码有什么问题吗？为什么数据不显示？

================================================== =================

以下是 getData 函数的更新代码:

function getData() {
 var grid = $("#grid").data("kendoGrid");
 grid.dataSource.transport.read.url = '@Url.Action("doSearch",new {needSearch = true})';
 grid.dataSource.read();
}

操作如下:

 public ActionResult doSearch(bool needSearch)
        {
            return Json("[{\"a\": \"First record\"},{\"a\": \"Second record\"}]");
        }

但是 Controller 中的 doSearch 操作没有触发

Answer 1

我尝试了你的方法，但这对我有用:

function getData() {
    var grid = $("#grid").data("kendoGrid");
    grid.dataSource.transport.options.read.url = '@Url.Action("doSearch", new {needSearch = true})';
    grid.dataSource.read();
}

备用:

$("#grid").kendoGrid({
    dataSource: {
        type: "json",
        transport: {
            read: '@Url.Action("doSearch", new {needSearch = true})'
        }
    }
);

注意:根据您的编辑，您的 Controller 方法需要更改为

public ActionResult doSearch(bool needSearch)
{
    return Json(new[] { new { a = "First record" }, new { a = "Second record" }};
}