增强网格中的行选择

Posted 2023-02-16

【中文标题】增强网格中的行选择

【英文标题】：Row Selection in Enhanced Grid

【发布时间】：2013-05-08 10:21:25

【问题描述】：

我是 Dojo 的新手，遇到了一个让我完全困惑的问题。我正在使用增强型网格在 Dojo 中创建数据网格。

网格中的每一行都有一个复选框，可以使用该复选框来选择该行。该复选框已使用间接选择插件实现。

现在，当我使用复选框选择一行时，一切正常。但是当我通过单击其他数据单元格来选择一行时，该行不会被选中！

这是数据网格的 JSP 部分

<table  data-dojo-id="grid" data-dojo-type="dojox.grid.EnhancedGrid" plugins="indirectSelection: headerSelector:true, filter: true,pagination: true"
    data-dojo-props="store:icGrid, 
     clientSort:true "  formatterScope="myFormatters" 
    style="width: 100%; height: 20em;">
     <thead>
         <tr>
      <th  field="empNo"  formatter="formatLink">empNo</th>
      <th  field="name">name</th>
      <th  field="email">email</th>
      <th  field="phone">phone</th>
    </tr>
  </thead>
</table>

如果我删除了引用间接选择的代码 (plugins="indirectselection...)，当我单击其他数据单元格时，行会被选中（因为它们应该如此）。但我还需要实现间接选择的复选框。

有没有办法在不取消行选择功能的情况下使间接选择工作？

看看我将在下面链接的页面中的网格。我需要一个像这样工作的网格 （页面中最后一个带有复选框的网格）

http://dojotoolkit.org/documentation/tutorials/1.8/working_grid/demo/selector.php

【参考方案1】：

我设法通过以下方式解决了这个问题： 1. 使用 cellClick 事件来监听 2. 点击时获取单元格的行索引 3. 将其设置为选中。

grid.on("CellClick", function(event)
     
        var rowId = event.rowIndex;
        grid.selection.setSelected(rowId, true);
        grid.render();
          

grid.selection.getSelected();没有返回选定的行，我想知道这是否是兼容性问题？似乎当我使用indirectSelection 插件时，行Select 的行为出乎意料。

【参考方案2】：

您听说过 DGRID 吗？ 我认为你应该检查一下。 真的很适合dojo。

这里有一些有用的网站。

Dgrid Main webpage

Git hub Documentation

【讨论】：

是的。似乎我的团队出于某种原因决定不使用 DGrid。所以我正在寻找一个适用于现有 EnhancedGrid 的修复程序。

【参考方案3】：

使用下面的代码来监听网格选择并检查 selectedRows 返回的内容并使用该行的索引来切换行

dojo.connect(grid, "onRowClick", function(e) 
     var selectedRows= grid.selection.getSelected();
     grid.rowSelectCell.toggleRow(selectedRows[i], true);
);

【讨论】：

grid.selection.getSelected 没有返回选定的行！。我无法弄清楚为什么。但我设法通过使用 CellClick 事件并获取“event.rowIndex”并将其设置为选中来解决问题。

【参考方案4】：

简单代码：- “SelectionChanged”` 甚至可用。所以代码是这样的：-

grid.on("SelectionChanged", function(event)
     
        var rowId = event.rowIndex;
        grid.selection.setSelected(rowId, true);
        grid.render();
          

【参考方案5】：

“SelectionChanged”` 甚至可用。所以代码是这样的：-

grid.on("SelectionChanged", function(event)
     
        var rowId = event.rowIndex;
        grid.selection.setSelected(rowId, true);
        grid.render();