网格如何在一个中包含多个列

时间:2013-01-17 19:26:09

标签: kendo-ui

我正在尝试将两列绑定到一个kendo网格列中。 以下似乎不起作用。

var grid = $("#grid").kendoGrid({
                dataSource: { data: SomeData },
                columns: [{
                    field: "Column1" + "Column2"
                }]

            }).data("kendoGrid");

3 个答案:

答案 0 :(得分:19)

如果您不需要编辑单元格,则可以执行所谓的组合单元格或组合,并使用KendoUI template实现。 (尝试谷歌搜索“kendoui grid with composed cells”)。

实施例

var leitmotifs = [
    { 
        company: "OnaBai", 
        leitmotif: "Working on a cloud of documents!" 
    },
    { 
        company: "Nike", 
        leitmotif: "Just do it!" 
    }
];

var grid = $("#table").kendoGrid({
    dataSource: {
        data: leitmotifs
    },
    columns   : [
        { 
            title: "Company", 
            template: "#= company + ' : ' + leitmotif #"
        }
    ]
});

答案 1 :(得分:6)

您是否查看了DataSource上的schema.parse方法?您可以将列添加为新字段,没有任何问题。然后当你到达网格时,该字段将可用。

dataSource: {
  transport: {
    read: "things"
  },
  schema: {
    parse: function (data) {
      // return a new collection which has a new field
      // that adds fields 2 and 3 together
      return $.map(data, function(item) {
       item.field4 = item.field2 + item.field3;
          return item;
      });
    }
  }
}

这是一个例子......

http://jsbin.com/azizaz/1/edit

答案 2 :(得分:3)

这是一个不同的解决方案,它还提供了在任一字段上独立排序的能力,同时仍保留单列数据。

columns: [
   {  // cell data 
      headerAttributes: { style: "display:none;" },
      attributes: { colspan: 2 },
      template: "#= field1 # #= field2 #"
   },
   {  // field 1 data
      field: "field1",
      title: "Field 1",
      attributes: { style: "display: none;" },
      template: ""
   },
   {  // field 2 data
      field: "field2",
      title: "Field 2",
      attributes: { style: "display: none;" },
      template: ""
   }
]