是否有带上下文菜单的dojo增强网格示例

时间:2010-04-17 21:09:06

标签: javascript dojo grid contextmenu

我正在寻找一个dojo增强网格的示例,该网格包含访问单元格或行数据的单元格或行菜单上的上下文菜单。我已设法使用行上下文菜单创建增强的网格。我可以创建一个捕获单击行菜单项的事件的函数。但是,我不知道如何在菜单项处理程序的上下文中访问行数据。我没有在每晚构建的测试中看到任何例子。在网上有这样的例子吗?

3 个答案:

答案 0 :(得分:1)

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

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>

当然,如果您以编程方式创建DataGrid,只需将 onRowContextMenu:onRowContextMenuFunc 添加到您的声明中。

答案 1 :(得分:0)

我明白了。甚至在行上下文菜单上,将行号捕获到全局中。甚至在菜单项上单击,从全局检索行,然后使用它来查找网格中行的内容。我一直在使用这种方法,它已经完美无缺。

答案 2 :(得分:0)

以下是从上下文菜单访问所选行的方法:

// First create a menu object to hold the various menus
var menusObject = {
    //  headerMenu: new dijit.Menu(),
rowMenu: new dijit.Menu()//,
//  cellMenu: new dijit.Menu(),
//   selectedRegionMenu: new dijit.Menu()
};

添加菜单项

menusObject.rowMenu.addChild(new dijit.MenuItem({
    label: "Show me data",
    onClick: function(e){
        console.log(this.selectedRow)
    }
}));

menusObject.rowMenu.startup();

创建网格

var grid = new dojox.grid.EnhancedGrid({
    store : store,
structure : layout,
rowsPerPage: 10,
escapeHTMLInData: false,
plugins: {
    menus: menusObject
}
}, 'some are to place');

//激活从数据网格行发送到菜单项的消息

dojo.connect(grid, 'onRowContextMenu', function(e)
{
    // Set the "selectedItem" property of all of the menu items of a menu.  This lets you reference the row data!!

    var menuChildren = menusObject.rowMenu.getChildren();
    for(var i = 0; i<menuChildren.length; i++){
        menuChildren[i].selectedRow = this.getItem(e.rowIndex);
    }
});