根据 if 条件将 enableCheckboxSelector 设置为 false [英] Set enableCheckboxSelector to false based on if condition

问题描述

我正在使用有角度的 slickgrid &默认情况下，我在网格选项中将 enableCheckboxSelector 设置为 true.但是基于下拉列表中的值更改，我想隐藏所有行的复选框，所以我写了

I am using angular slickgrid & by default I have enableCheckboxSelector set to true in grid options. But based on value change in dropdown I want to hide checkboxes for all rows so I have written

`if(isReadOnly){
this.gridOptions.enableCheckboxSelector = false;
}
else{
this.gridOptions.enableCheckboxSelector = true;
}`

但它没有按预期工作.谁能帮我解决这个问题.谢谢.

but it is not working as expected. Can anyone help me fix this. Thanks.

推荐答案

您误解了这是如何工作的，enableCheckboxSelector 网格选项是显示(或不显示)行选择列.如果您将该选项设置为 false，那么您将删除整个列(这根本不是您想要的).

You misunderstand how this works, the enableCheckboxSelector grid option is to show (or not) the row selection column. If you put that option to false, then you get rid of that entire column (which is not at all what you want).

您需要的是 selectableOverride，它显示在此 行选择 - Wiki.Wiki 上有大量信息供您阅读.

What you need is selectableOverride and it is shown in this Row Selection - Wiki. The Wikis have plenty of information for you to read.

this.gridOptions = {
      enableRowSelection: true,
      enableCheckboxSelector: true,
      checkboxSelector: {
        // you can override the logic for showing (or not) the expand icon
        // for example, display the expand icon only on every 2nd row
        selectableOverride: (row: number, dataContext: any, grid: any) => (dataContext.id % 2 === 1)
      },
      multiSelect: false,
      rowSelectionOptions: {
        // True (Single Selection), False (Multiple Selections)
        selectActiveRow: true,
      },
};

如果您想在事后更改网格选项，您可以通过网格(SlickGrid 网格对象)和 setOptions 方法(请参阅 SlickGrid & DataView 对象)

If you want to change the grid options after fact, you can do that via the grid (SlickGrid grid object) and the setOptions method (see SlickGrid & DataView Objects)

注意:仅更改 enableCheckboxSelector 不会将其从 UI 中删除，因为行选择现在是列定义中的一列.因此，如果您首先显示然后想要删除它，则必须自己从 columnDefinitions 数组中删除它，如果要重新添加它，则最好保留该列的副本在你删除它之前，因为 Angular-Slickgrid 不会自己做.换句话说，Angular-Slickgrid 会添加行选择器列，但不会删除它，你必须自己做这部分.

NOTE: just changing the enableCheckboxSelector will not remove it from the UI because the row selection is now a column within your column definitions. So if you first displayed and then want to remove it, you'll have to remove it yourself from your columnDefinitions array and if you want to re-add it, then you better keep a copy of that column before you delete it since Angular-Slickgrid won't do it by itself. In other words, Angular-Slickgrid will add the row selector column but it won't remove it, you have to do that part yourself.

angularGridReady(angularGrid: AngularGridInstance) {
    this.angularGrid = angularGrid;
    this.gridObj = angularGrid.slickGrid;
}

changeGridOptions() {
  const isReadyOnly = false; // whatever your code logic is here...
  this.angularGrid.slickGrid.setOptions({ enableCheckboxSelector: isReadyOnly });
  if (isReadOnly) {
    // you also need to remove the column from your column definitions
    // you can do that by using slice which will also trigger a dirty change to refresh the grid
    this.columnDefinitions = this.columnDefinitions.slice(1); // return all columns without first one (without index 0)
  }
}

您可以在 setOptions 更改网格选项的现场示例"nofollow noreferrer">示例 3 - 编辑器，自动提交编辑"复选框(和自动编辑设置"单选框)通过 setOptions

You can see a live example of changing the grid options via setOptions in the Example 3 - Editors, the "Auto Commit Edit" checkbox (and "autoEdit setting" radiobox) is updated via the setOptions

这篇关于根据 if 条件将 enableCheckboxSelector 设置为 false的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！