Simple Json connection not working

2019-08-31 07:48发布

站内问答 / 移动开发
1889 1 4

I am trying to familiarise myself with the kendo ui dataSource, I have never before used JSON and have constructed the following using your documentation:

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 File:

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

The grid doesn't load any data, all I see are the headers.

I have tried this using simply HTML and a JSON file, I have also tried this in Visual Studio.

Any help would be appreciated

1条回答
你好瞎i
2楼-- · 2019-08-31 08:08

In your JSON the data transmitted is not an array but an object so you need to specify where in that object the data is stored, making possible to KendoUI DataSource finding it. This is specified using schema.data

Your datasource should be:

var myDataSource = new kendo.data.DataSource({
    transport: {
        read: {
            url     : "people.json",
            dataType: "json"
        }
    },
    schema   : {
        data: "people"
    }
});
查看更多
0人赞 添加讨论(0) 举报
登录 后发表回答
相关问题
查看全部
相关文章
查看全部
收藏的人(4)