0

Dojo 1.5. I have an enhanced grid that has a rowMenu defined like so:

<div dojoType="dijit.Menu" id="rowMenu" style="display: none;">
    <div dojoType="dijit.MenuItem" id="menuUsers">Add/Edit Users</div>
</div>

I listen to the onclick for that menu item like this:

dojo.connect(dijit.byId("menuUsers"), "onClick", addEditUsers);

If I try to use e.rowIndex in addEditUsers, it is undefined. The only way I've been able to figure out how to get the row the user right clicks on is by a separate row listener:

dojo.connect(dijit.byId("grid"), "onRowContextMenu", rowContextMenu);

From rowContextMenu(), e.rowIndex is available, so I can get row data using

var item = e.grid.getItem(e.rowIndex);
console.log(e.grid.store.getValue(item, 'name')); // this will show the value of a 'name' column for the row the user right clicked.

So I could use this to toggle a global/object (e.g. currentContextItem), but it seems like there's gotta be an easier approach. Is there not a direct way to get at the rowIndex/data from the context menu item listener? Note that I cannot use grid.selection.getSelected() because that is whatever row the user last left clicked on.

czervik
  • 2,537
  • 23
  • 15

2 Answers2

2

AFAIK, there is no other solution. In fact, I asked the same question months ago, and that was the only solution I got.

Jose L Martinez-Avial
  • 2,191
  • 4
  • 28
  • 42
2

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. 

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);
}

.

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

Of course, if you were programatically creating your DataGrid, you would just add onRowContextMenu: onRowContextMenuFunc to your declaration.

slugster
  • 49,403
  • 14
  • 95
  • 145
Andrew Bucklin
  • 699
  • 8
  • 19
  • EDIT: Had some problems with the above code in that it allowed a user to right click on a row, then click cancel or otherwise hide the context menu and then right click in a BLANK area of the data grid and click the Delete menu option and it would remove the item that was right clicked on previously. If you're having the same problem, check out my modified code [HERE](http://stackoverflow.com/questions/8187693/dojo-datagrid-context-menu-onrowcontextmenu-displays-even-when-right-clicking-in/8216093#8216093) – Andrew Bucklin Nov 21 '11 at 19:00