Dojo：如何在网格的上下文菜单项处理程序中获取行数据？答案

【问题标题】：Dojo: how to get row data in grid's context menu item handler?Dojo：如何在网格的上下文菜单项处理程序中获取行数据？
【发布时间】：2011-03-12 11:30:35
【问题描述】：

我正在使用 Dojo 1.4。

给定一个 dojox.grid.DataGrid 标记：

<table jsId="grid1" dojoType="dojox.grid.DataGrid" 
       structure="layout"
       delayScroll="true" 
       columnReordering="true" 
       selectable="true"
       onRowDblClick="onRowDblClick"
       onRowContextMenu="onRowContextMenu"
       headerMenu="grid1_headerMenu"
       >
  <div dojoType="dijit.Menu" id="grid1_rowMenu" jsId="grid1_rowMenu" style="display: none;">
    <div dojoType="dijit.MenuItem" onClick="gridRowContextMenu_onClick">Edit</div>
  </div>
</table>

我还没有找到一种更好的方法来显示网格的上下文菜单：

function onRowContextMenu(e) {
       grid1_rowMenu.bindDomNode(e.grid.domNode);
}

它可以工作，弹出菜单并调用函数'gridRowContextMenu_onClick'。

function gridRowContextMenu_onClick(e) {
  // how to get a row data???
}

我的问题是如何在 menuitem 的 onClick 处理程序 (gridRowContextMenu_onClick) 中获取弹出菜单的原始行？

【问题讨论】：

标签： dojo dojox.grid

【解决方案1】：

您可以使用事件网格对象：

 var item = e.grid.getItem(e.rowIndex);

【讨论】：

【解决方案2】：

我也有类似的问题。我想创建一个上下文菜单，允许用户从数据网格中删除他们右键单击的项目并从数据存储中删除该项目。认为这应该很简单，在您的帮助和其他一些网站的帮助下，我想出了以下代码。我希望这对将来的某人有所帮助。

Javascript

var selectedItem;  // This has to be declared "globally" outside of any functions

function onRowContextMenuFunc(e) {
    grid5_rowMenu.bindDomNode(e.grid.domNode);
    selectedItem = e.grid.getItem(e.rowIndex);
}

function gridRowContextMenu_onClick(e) {
    store3.deleteItem(selectedItem);
}

HTML

<div dojoType="dijit.Menu" id="grid5_rowMenu" jsId="grid5_rowMenu" style="display: none;">
    <div dojoType="dijit.MenuItem" onClick="gridRowContextMenu_onClick">Delete</div>
    <div dojoType="dijit.MenuItem">Cancel</div>
</div>

和

<div id="grid" dojoType="dojox.grid.DataGrid" jsId="grid5" store="store3" structure="layoutStructure" rowsPerPage="40" onRowContextMenu="onRowContextMenuFunc"></div>

当然，如果您以编程方式创建 DataGrid，您只需将 onRowContextMenu: onRowContextMenuFunc 添加到您的声明中，就像您在上面的问题中所做的那样。

最后，实际获取有关该项目的信息：

console.log(e.grid.store.getValue(selectedItem, 'type'));
console.log(e.grid.store.getValue(selectedItem, 'color'));
// Where type and color are fields specified in the DataGrid Layout Structure //

【讨论】：

编辑：上面的代码有一些问题，它允许用户右键单击一行，然后单击取消或隐藏上下文菜单，然后右键单击数据的空白区域网格并单击删除菜单选项，它将删除之前右键单击的项目。如果你有同样的问题，请查看我修改后的代码HERE

【解决方案3】：

您尝试过 e.rowIndex 吗？

【讨论】：

e.rowIndex 不能从 gridRowContextMenu_onClick 函数获得，只能从 onRowContextMenu 获得。