为kendo网格远程分组数据的方法是什么?

时间:2015-10-13 09:13:56

标签: kendo-ui kendo-grid kendo-asp.net-mvc

我有来自服务器的数据,如

Id    AppId
1     23
2     28
1     69
1     123

在剑道网格上如何做到这一点

Id    AppId
1     23,69,123
2     28

1 个答案:

答案 0 :(得分:0)

您可以使用数据源的组功能:

var data = [
    {Id: 1, AppId: 23},
    {Id: 2, AppId: 28},
    {Id: 1, AppId: 69},
    {Id: 1, AppId: 123},               
];

var ds = new kendo.data.DataSource({
      data: data,
      schema: {
          model: {
              fields: {
                  Id: { type: "number" },
                  AppId: { type: "number" },
              }
          }
      },
      group: {
          field: "Id"
      }                
});

然后,如果您想按功能使用网格组:

$("#grid").kendoGrid({
    dataSource: ds,
    columns: [
        { field: "Id", title: "ID",  },
        { field: "AppId", title: "Application ID" },
    ]
});

如果需要逗号分隔列表,请使用数据源的fetch()方法构建新数据数组:

var groupedData = [];

ds.fetch(function(){
    var data = this.view();
    for (var i=0; i< data.length; i++){          
      var id = data[i].value;
      var text = '';
      for (var j=0; j< data[i].items.length; j++){
        text += data[i].items[j].AppId;
        if (j< data[i].items.length - 1){
         text += ','; 
        }
      }
      groupedData.push({Id: id, AppId: text});          
    }
});

$("#grid2").kendoGrid({
    dataSource: groupedData,
    columns: [
        { field: "Id", title: "ID",  },
        { field: "AppId", title: "Application ID" },
    ]
});

以下DOJO提供了两种选择:

  

<强> DEMO