Kendo UI Grid：一对多组

Question

是否可以在具有数组值的列上的Kendo UI Grid中应用组？

[{name: "Tony Stark", title: ["CEO", "Super Hero"]}, {name: "Elon Musk", title: "CEO"}]

我想最终得到以下层次结构：

CEO
 |_ Tony Stark
 |_ Elon Musk
Super Hero
 |_ Tony Stark

Answer 1

您显示的层次结构表示可以由Kendo UI TreeView呈现，但您提到了Grid。

网格将层次结构显示为具有可扩展组标题的网格。该组在数据源上指定，数据源应该“展平”。

因此，您可以将.map您的名称/标题和名称/ [标题]数组放入名称/标题的扁平数组中，并将其用作网格数据源。

例如：

var name_titles = [
  {name: "Tony Stark", title: ["CEO", "Super Hero"]},
  {name: "Elon Musk", title: "CEO"}
];

var title_names = $.map(name_titles,function(item){
  if (item.title) {
    if (item.title.constructor === Array) {
      return $.map(item.title,function(title) {
        return {name:item.name, title:title}
      })
    }
    else {
      return item;
    }
  }
  else {
    return null;
  }
});    

$("#grid").kendoGrid({
  dataSource: {
    data: title_names,
    group: { field: "title" }
  }
});