0

我正在尝试熟悉 kendo ui 数据源,我以前从未使用过 JSON,并使用您的文档构建了以下内容:

html:

<!doctype html>
<html>
    <head>
        <title>Kendo UI Web</title>
        <link href="styles/kendo.common.min.css" rel="stylesheet" />
        <link href="styles/kendo.default.min.css" rel="stylesheet" />
        <script src="js/jquery.min.js"></script>
        <script src="js/kendo.web.min.js"></script>
    </head>
    <body>
        <div id="grid"></div>
        <script>
        $(document).ready(function () {
            var myDataSource = new kendo.data.DataSource({
                transport: {
                    read: {
                        url: "people.json",
                        dataType: "json"
                    }
                }
            });

            $("#grid").kendoGrid({
                dataSource: myDataSource,
                    columns: [
                    {
                        field: "firstName",
                        title: "First Name"
                    },
                    {
                        field: "lastName",
                        title: "Last Name"
                }]
            });

        });

    </script>
    </body>
</html>

json文件:

{
    "people": [
        { "firstName":"John" , "lastName":"Doe" },
        { "firstName":"Anna" , "lastName":"Smith" },
        { "firstName":"Peter" , "lastName":"Jones" }
    ]
}

网格不加载任何数据,我看到的只是标题。

我已经尝试过使用简单的 HTML 和 JSON 文件,我也在 Visual Studio 中尝试过。

任何帮助,将不胜感激

4

1 回答 1

0

在您的 JSON 中,传输的数据不是一个,array而是一个,object因此您需要指定数据在该对象中的存储位置,以便 KendoUI DataSource 找到它。这是使用指定的schema.data

您的数据源应该是:

var myDataSource = new kendo.data.DataSource({
    transport: {
        read: {
            url     : "people.json",
            dataType: "json"
        }
    },
    schema   : {
        data: "people"
    }
});
于 2013-09-24T10:55:06.797 回答