可以隐藏SlickGrid列而不将其从“;列”;大堆

Possible to hide a SlickGrid column WITHOUT removing it from the "columns" array?

本文关键字：大堆 隐藏 SlickGrid      更新时间：2023-09-26

我想隐藏一列（它的ID列对每一行都是唯一的），但我无法将其从"列"数组中删除，因为当对行执行操作（选择、排序等）时，我需要行中的数据。

例如，在排序之后，我需要获取将它们与以前的样式相匹配的Rows，我可以使用ID列来完成这项工作。我需要行中的数据，我只是不希望它被显示。

谢谢。

答案是否定的，但这不是您想要的答案：）

除了要获取数据的列之外，它们和数据项之间没有硬链接。您不必让列可见，就可以在数据项上具有ID。

如果有人还在找这个，我找到了一种方法。。。它不是很优雅，但它确实有效。按照Simon的建议，添加Id列作为网格中的最后一列。将cssClass和headerCssClass都设置为"display:none！important"，并将width、minWidth和maxWidth列选项设置为0，如下所示：

var columns = [
    { id: "MyColumnId", name: "My Column", field: "MyColumnData", width: 100},
    { id: "Id", name: "Id", field: "Id", width: 0, minWidth: 0, maxWidth: 0, cssClass: "reallyHidden", headerCssClass: "reallyHidden" }
];

css为：

.ereallyHidden｛display:none！important；｝

希望能有所帮助。

这是不可能的，但作为解决方法，您可以将width/maxWidth设置为1，将名称设置为空字符串，并将列放在所有其他列的在最右边。就像这样（例如在coffeescript中，如果您对语法的使用感到不确定http://js2coffee.org/)：

columns = [
          ... some columns ...
            {
               id:"hidden"
               name:""
               field:"id"
               sortable:"true"
               width: 1
               maxWidth: 1
               minWidth: 1
               unselectable: true
               formatter: (row,cell,val,columnDef,dataContext) ->
                  "<div style='display: none;'>#{val}</div>"
            }
         ]

我今天遇到了同样的问题，我正在处理纯数组数据。如果您在数据数组的末尾添加值，但没有在列数组中定义它们，则数据存在，您可以在事件中使用它，但它不会显示。

示例：

new Slick.Grid({
    document.getElementById('grid')
    , [
        [1, 2, 3, 1]
        , [1, 2, 3, 2]
        , [1, 2, 3, 3]
        , [1, 2, 3, 4]
        , [1, 2, 3, 5]
    ]
    , headers: [
        {
            field: '0'
            , id: 'foo'
            , name: 'foo'
        }
        , {
            field: '1'
            , id: 'bar'
            , name: 'bar'
        }
        , {
            field: '0'
            , id: 'baz'
            , name: 'baz'
        }
    ]
    , {}
);

正如您在代码中看到的，我为没有列定义的网格提供了第4个值。

对于这类问题，我使用了两个数组。一个用于显示，另一个用于columnPicker。

var org_columns = [],hid_columns = [];
org_columns.push(
cb_selector.getColumnDefinition(),
{id: "id", name: "ID", field: "id", sortable: true, width: 56},
{id: "name", name: "Name", field: "name", editor: Slick.Editors.Text, sortable: true, width: 234},
{id: "email", name: "Email", field: "email", editor: Slick.Editors.Text, sortable: true, width: 234}
);
hid_columns.push(
cb_selector.getColumnDefinition(),
{id: "name", name: "Name", field: "name", editor: Slick.Editors.Text, sortable: true, width: 234},
{id: "email", name: "Email", field: "email", editor: Slick.Editors.Text, sortable: true, width: 234}
);
var data_view = new Slick.Data.DataView();
grid = new Slick.Grid("#grid", data_view, hid_columns, grid_options);
var columnPicker= new Slick.Controls.ColumnPicker(org_columns, grid,grid_options);

在coloumbs.push（｛id:id，name:name，Hidden:true｝）//hidden确保在绑定网格时删除该列

我意识到这是一个老问题，但正确的方法是使用dataProvider并使用getItemMetaData来提供您不一定想要显示的信息。

选择行时，可以调用grid.getItemMetaData（cell.row）来获取所需的额外信息。getItemMetaData应返回一个描述行级和单元格级元数据的jsonObject。

这是描述它的文档。

https://github.com/mleibman/SlickGrid/wiki/Providing-data-to-the-grid

在寻找了关于这些问题的一些答案后，我找到了一个解决方法，它可以很好地隐藏列并保存数据。

我最初的问题是我需要隐藏网格的ID列，所以基本上我通过创建带有name属性的only来隐藏ID列，而不指定任何其他内容，然后创建了我期望的列。

相关文章：