Javascript 如何将JSON数据传递到KendoUI网格

今天我尝试在我的网站上实现一个kendo gridview，实际上我使用的是一个Web服务，它会给我一个JSON结果。 结果是：

[{"IdComponente":"8","NoParte":"12","Descripcion":"Componente A","CostoUnitario":"0.12"},{"IdComponente":"9","NoParte":"123","Descripcion":"Componente B","CostoUnitario":"0.23"},{"IdComponente":"10","NoParte":"1234","Descripcion":"Componente C","CostoUnitario":"0.54"},{"IdComponente":"11","NoParte":"12345","Descripcion":"Componente D","CostoUnitario":"0.90"},{"IdComponente":"12","NoParte":"123456","Descripcion":"Componente E","CostoUnitario":"1.25"},{"IdComponente":"13","NoParte":"1234567","Descripcion":"Componente F","CostoUnitario":"0.12"},{"IdComponente":"14","NoParte":"12345678","Descripcion":"Componente G","CostoUnitario":"0.12"},{"IdComponente":"16","NoParte":"123456789","Descripcion":"Componente H","CostoUnitario":"0.98"}]

我使用这个脚本，问题是我在控制台中没有得到任何错误，但是它没有显示网格中的信息。 所以，我不知道为什么，因为json结果没问题

    <script>
    $(document).ready(function () {
        $.ajax({
            type: "POST",
            url: "WSComponentes.asmx/obtenerComponentes",
            data: '',
            contentType: "application/json; charset=utf-8",
            dataType: "json", // dataType is json format
            success: function OnSuccess(response) {
                cargarGrid(response);
            },
            error: function onError(error) {
                console.log(error.d);
            },
        });
    });

    function cargarGrid(datos) {
        console.log(datos);
        $("#grid").kendoGrid({
            dataSource: {
                dataType: 'json',
                data: datos,
                schema: {
                    data: "d",
                    type: "json",
                    model: {
                        fields: {
                            IdComponente: { editable: false, type: "string" },
                            NoParte: { editable: false, type: "string" },
                            Descripcion: { editable: false, type: "string" },
                            CostoUnitario: { editable: false, type: "string" }
                        }
                    }
                },
                pageSize: 10
            },
            height: 550,
            groupable: true,
            sortable: true,
            pageable: {
                refresh: true,
                pageSizes: true,
                buttonCount: 5
            },
            columns: [{
                field: "IdComponente",
                title: "IdComponente",
            }, {
                field: "NoParte",
                title: "NoParte"
            }, {
                field: "Descripcion",
                title: "Descripcion"
            }, {
                field: "CostoUnitario",
                title: "CostoUnitario",
            }
            ]
        });
    }
</script>

$（文档）.ready（函数（）{
$.ajax({
类型：“POST”，
url:“wscomponents.asmx/obtenercomponents”，
数据：“”，
contentType:“应用程序/json；字符集=utf-8”，
数据类型：“json”，//数据类型为json格式
成功：函数OnSuccess（响应）{
cargarGrid（响应）；
},
错误：函数onError（错误）{
console.log（error.d）；
},
});
});
功能cargarGrid（datos）{
控制台日志（datos）；
$（“#网格”）.kendoGrid({
数据源：{
数据类型：“json”，
数据：达托斯，
模式：{
数据：“d”，
键入：“json”，
型号：{
字段：{
IdComponente:{可编辑：false，键入：“string”}，
NoParte:{editable:false，键入：“string”}，
description:{可编辑：false，键入：“string”}，
CostoUnitario:{可编辑：false，键入：“string”}
}
}
},
页面大小：10
},
身高：550，
分组：对，
可排序：是的，
可分页：{
刷新：是的，
页面大小：对，
按钮数：5
},
栏目：[{
字段：“IdComponente”，
标题：“IdComponente”，
}, {
字段：“NoParte”，
标题：“NoParte”
}, {
字段：“描述”，
标题：“描述”
}, {
字段：“CostoUnitario”，
标题：“CostoUnitario”，
}
]
});
}

你所拥有的并不遥远。。您需要声明一个：

然后在网格声明中使用，如下所示：

$("#grid").kendoGrid({
    dataSource: dataSource, ....

下面是一个示例，演示所需的实现更改

$("#grid").kendoGrid({
    dataSource: dataSource, ....