kendo Grid加载远程数据方式

时间:2017-06-15 17:55

kendo Grid官网提供的远程加载数据的方式在实际中其实不可行的。下面是它在官网中加载数据的例子:

kendo Grid官网提供的远程加载数据的方式在实际中其实不可行的。下面是它在官网中加载数据的例子:

 <div id="example">             <div id="grid"></div>             <script>                 $(document).ready(function() {                     $("#grid").kendoGrid({                         dataSource: {                             type: "odata",//官网中数据的type                             transport: {                                 read: ""                             },                             //它这边ajax返回的数据是一个数组列表                             schema: {                                 model: {                                     fields: {                                         OrderID: { type: "number" },                                         Freight: { type: "number" },                                         ShipName: { type: "string" },                                         OrderDate: { type: "date" },                                         ShipCity: { type: "string" }                                     }                                 }                             },                             pageSize: 20,                             serverPaging: true,                             serverFiltering: true,                             serverSorting: true                         },                         height: 550,                         filterable: true,                         sortable: true,                         pageable: true,                         columns: [{                                 field:"OrderID",                                 filterable: false                             },                             "Freight",                             {                                 field: "OrderDate",                                 title: "Order Date",                                 format: "{0:MM/dd/yyyy}"                             }, {                                 field: "ShipName",                                 title: "Ship Name"                             }, {                                 field: "ShipCity",                                 title: "Ship City"                             }                         ]                     });                 });             </script>         </div>