我正在尝试在网格中使用服务器分组。
我不确定“schema.groups”和“schema.data”之间的区别。我知道我应该在数据未分组时使用shema.data,在数据分组时使用schema.groups。我试图提供一个非常简单的示例,对data.json文件的ajax请求来模拟服务器响应。只需将testGrouping.html和data.json文件放在任何http服务器的根目录中即可重现我的问题。
当我运行给定的代码时,我没有错误,但网格仍然是空的。我希望网格显示1组5行,没有任何聚合。
你能帮忙找出给定样本中的错误吗?
谢谢您的帮助。
这是我正在使用的html页面(testGrouping.html):
<!DOCTYPE html>
<html>
<head>
<style>html { font-size: 14px; font-family: Arial, Helvetica, sans-serif; }</style>
<title></title>
<link rel="stylesheet" href="https://kendo.cdn.telerik.com/2017.1.223/styles/kendo.common-material.min.css" />
<link rel="stylesheet" href="https://kendo.cdn.telerik.com/2017.1.223/styles/kendo.material.min.css" />
<link rel="stylesheet" href="https://kendo.cdn.telerik.com/2017.1.223/styles/kendo.material.mobile.min.css" />
<script src="https://kendo.cdn.telerik.com/2017.1.223/js/jquery.min.js"></script>
<script src="https://kendo.cdn.telerik.com/2017.1.223/js/kendo.all.min.js"> </script>
</head>
<body>
<div id="example">
<div id="grid"></div>
<script>
$(document).ready(function() {
$("#grid").kendoGrid({
dataSource: {
transport: {
read: {
url: "data.json?x=1",
cache:false,
type: 'GET',
dataType: 'json',
contentType: "application/json"
},
},
error: function(e) {
console.log(e.errors); // displays "Invalid query"
},
schema:{
// "data":"titi",
"groups":"groups",
"total": "total",
"model": {
"fields": [
{
"field": "m2"
},
{
"field": "m"
},
]
}
},
pageSize: 7
},
sortable: true,
scrollable: false,
pageable: true,
serverPaging: true,
serverAggregates: true,
serverFiltering: true,
serverGrouping: true,
serverSorting: true,
columns: [
{
"field": "m2",
"title": "Group odd / even"
},
{
"field": "m",
"title": "Month"
}
]
});
});
</script>
</div>
这里使用的数据来模拟服务器响应(data.json):
{
"total":1,
"groups":
[ {
"aggregates": [],
"value": "rrr",
"hasSubgroups": false,
"field": "m2",
"items": [
{
"m2": "rrr",
"m": 1
},
{
"m2": "rrr",
"m": 1
},
{
"m2": "rrr",
"m": 1
},
{
"m2": "rrr",
"m": 1
},
{
"m2": "rrr",
"m": 1
}
],
"aggregates": {}
}]
}
我已经和它斗争了几天但是我最终使用https://docs.telerik.com/kendo-ui/knowledge-base/grid-format-of-the-response-with-server-grouping和https://docs.telerik.com/kendo-ui/framework/datasource/basic-usage#server-grouping进行了参考
将数据源的schema.groups属性设置为返回包含组的响应属性的函数
schema: {
groups: function (e) {
return e.Groups;
}
}
从服务器返回以下格式
Groups = [
{
field: "GroupField",
value: "Group1",
items: [],
aggregates: {},
hasSubgroup: false
},
{
field: "GroupField",
value: "Group2",
items: [],
aggregates: {},
hasSubgroup: false
}
]