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

Question

我试图将两列绑定到一个kendo网格列.以下似乎不起作用.

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

            }).data("kendoGrid");

Answer 1

如果您不需要编辑单元格,则可以执行所谓的组合单元格或组合,并使用KendoUI实现template.(尝试谷歌搜索"kendoui网格与组合细胞").

例

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 #"
        }
    ]
});

Answer 2

您是否查看了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

Answer 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: ""
   }
]