如何在SlickGrid中添加隐藏列

7

在SlickGrid中是否可以有一个隐藏的列?所谓隐藏列是指我想为每一行保存一些数据,但我不希望这些数据显示在网格上。


我应该把它放在哪里?我认为这不是一个好的做法。 - sivann
3个回答

17

数据和网格中的列之间不存在隐含关系-两者完全独立。因此,您的数据可以包含比实际绑定到网格列更多的字段。

示例:

var grid;
var columns = [
  {id: "title", name: "Title", field: "title"},
  {id: "duration", name: "Duration", field: "duration"},
  {id: "%", name: "% Complete", field: "percentComplete"},
  {id: "effort-driven", name: "Effort Driven", field: "effortDriven"}
];

var options = {
  enableCellNavigation: true,
  enableColumnReorder: false
};

$(function () {
  var data = [];
  for (var i = 0; i < 500; i++) {
    data[i] = {
      title: "Task " + i,
      duration: "5 days",
      percentComplete: Math.round(Math.random() * 100),
      start: "01/01/2009",
      finish: "01/05/2009",
      effortDriven: (i % 5 == 0)
    };
  }

  grid = new Slick.Grid("#myGrid", data, columns, options);
})

我的data数组包含startfinish字段,但我选择在创建columns数组时将它们排除在外。


太好了!我本以为这会破坏SlickGrid。谢谢你,njr。 - sivann
这是正确的。然而在我的情况下,总共有8列,其中4列显示在网格中。当使用复合编辑器时,如果未声明列,如何定义列编辑器?一个“可见”列属性会非常好。 - user1517081
在 http://mleibman.github.io/SlickGrid/examples/ 上有复合和组合编辑器的示例。 - Ben McIntyre

3
我认为您可以通过使用grid.setColumns来实现-假设您在声明网格时设置了columns={id,a,b,c};在网格初始化之后,您可以调用grid.setColumns(newColumns),其中newColumns是新的列数组,不包括id- newColumns = {a,b,c}
这一列仍然可访问,并且与其关联的所有数据也应该可用。
希望这可以帮助您!

1
在angular-slickgrid版本中,您可以执行以下操作: 1. 在列定义中,包括所有列 2. 在Present中,重新添加您想在网格中看到的列ID。现在加载页面并查看列选择器菜单。您会高兴地看到所有列。一些未选中。
例如。
    this.columnDefinitions = [
    { id: 'name', name: 'Name', field: 'name', filterable: true, sortable: true },
    { id: 'duration', name: 'Duration', field: 'duration', filterable: true,sortable: true },
    { id: 'complete', name: '% Complete', field: 'percentComplete', filterable:true,sortable: true }
    ];



this.gridOptions = {
      presets: {
        // the column position in the array is very important and represent
        // the position that will show in the grid
        columns: [
          { columnId: 'duration', width: 88, headerCssClass: 'customHeaderClass' },
          { columnId: 'complete' }
        ]
// name will be present in the menu but not on the grid

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接