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

发布于 2024-09-08 13:10:46 字数 981 浏览 5 评论 0原文

我正在使用 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) 内部如何获取弹出菜单的原始行？

原文

I'm using Dojo 1.4.

Given a dojox.grid.DataGrid in markup:

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

I haven't found a better way to show grid's contex menu that this one:

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

It works, menu pops up and function 'gridRowContextMenu_onClick' has being called.

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

My question is how inside menuitem's onClick handler (gridRowContextMenu_onClick) can I get original row for which menu was poped up?

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

怼怹恏 2024-09-15 13:10:46

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

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

You can use the event grid object:

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

回复收藏 0 原文

土豪 2024-09-15 13:10:46

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

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

I had a similar question. I wanted to create a context menu which allowed the user to remove the item that they right clicked on from the datagrid and delete the item from the datastore. Thought it should be pretty simple and with your help and some other sites, I came up with the following code. I hope this helps someone in the future.

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>

and

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

Of course, if you were programatically creating your DataGrid, you would just add onRowContextMenu: onRowContextMenuFunc to your declaration, as you did in your question above.

Finally, to actually get information about the item:

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

回复收藏 0 原文