代码之家 › 专栏 › 技术社区 › Shrike

Dojo:如何在grid的上下文菜单项处理程序中获取行数据?

dojox.grid dojo

Shrike · 技术社区 · 16 年前

给定标记中的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>

我还没有找到更好的方法来显示grid的contex菜单:

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

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

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

3 回复 | 直到 16 年前

cÐ½Ådk 9 年前

可以使用事件网格对象:

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

OGHaza Ahmed Naveed 12 年前

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

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 //