KendoUI网格从数据源获取但未显示

时间:2014-11-14 22:24:32

标签: json angularjs kendo-ui kendo-grid

使用下面的代码,我看到所有数据都在浏览器控制台中正确获取但是网格没有显示任何内容,并且我得到了未定义的未被捕获的错误"。不知道那是指什么。你能指出我需要解决的问题吗?这是我从Telerik网站上取下的代码,我将数据源类型从odata更改为json,将url更改为我的。

<!DOCTYPE html>
<html>
<head>
<base href="http://demos.telerik.com/kendo-ui/grid/angular">
<style>html { font-size: 12px; font-family: Arial, Helvetica, sans-serif; }</style>
<title></title>
<link href="http://cdn.kendostatic.com/2014.2.1008/styles/kendo.common.min.css" rel="stylesheet" />
<link href="http://cdn.kendostatic.com/2014.2.1008/styles/kendo.default.min.css" rel="stylesheet" />
<link href="http://cdn.kendostatic.com/2014.2.1008/styles/kendo.dataviz.min.css" rel="stylesheet" />
<link href="http://cdn.kendostatic.com/2014.2.1008/styles/kendo.dataviz.default.min.css" rel="stylesheet" />
<script src="http://cdn.kendostatic.com/2014.2.1008/js/jquery.min.js"></script>
<script src="http://cdn.kendostatic.com/2014.2.1008/js/angular.min.js"></script>
<script src="http://cdn.kendostatic.com/2014.2.1008/js/kendo.all.min.js"></script>
</head>
<body>
<div id="example" ng-app="KendoDemos">
<div ng-controller="MyCtrl">
    <kendo-grid options="mainGridOptions"></kendo-grid>

    <script type="text/x-kendo-template" id="template">
    </script>

</div>
</div>

<script>
angular.module("KendoDemos", [ "kendo.directives" ]);
function MyCtrl($scope) {
    $scope.mainGridOptions = {
        dataSource: {
            type: "json",
            transport: {
                read: "http://localhost:8090/rest/kdxposapi/salesman?app_name=kdxpos",
                beforeSend: function(req) {
                    req.setRequestHeader('Authorization', 'dolh45p0isg2c8nl9shc3kjee1');
                }
            }
        },
        sortable: true,
        pageable: true,
        detailTemplate: kendo.template($("#template").html()),
        dataBound: function() {
            this.expandRow(this.tbody.find("tr.k-master-row").first());
        },
        columns: [{
            field: "FirstName",
            title: "First Name",
            width: "120px"
        },{
            field: "LastName",
            title: "Last Name",
            width: "120px"
        }]
    };

}
</script>


</body>
</html>

0 个答案:

没有答案
相关问题