Todd Krueger
Todd Krueger

Reputation: 137

Dynamically Add contextmenu to Ext.tree.TreePanel

I am trying to add dynamically created contextmenu's to an Ext.tree.TreePanel object. The menus will all be different depending on user selections.

I can create the menu outside the treePanel descriptor but how can I append the dynamically created menu to the Ext.tree.TreePanel? The documentation seems to indicate that treePanel.on(nameOfMenuHere) would append the menu but it returns as undefined.

var menu1 = new Ext.menu.Menu({
    id: 'menu1',
    items: [{
        id: 'menu1-item1',
        text: 'Menu 1 - Item 1'
    },
    {
        id: 'menu1-item2',
        text: 'Menu 1 - Item 2'
    }],
    listeners: {
        itemclick: function (item) {
            switch (item.id) {
                case 'menu1-item1':
                    var n = item.parentMenu.contextNode;
                    if (n.parentNode) {
                        alert(n.parentNode.text);
                        //Ext ID and text of selected node
                        alert("node ID: " + n.id + ", node text: " + n.text);
                    }
                break;
            }
        } 
    }
}); 

userLayerTree.on(menu1);

Upvotes: 0

Views: 908

Answers (1)

pavlos
pavlos

Reputation: 3081

use the listener itemcontextmenu within the tree panel. something like this should work.

var tpanel = {
    xtype : 'treepanel',
    width: 250,
.........
..........
listeners : {
        itemcontextmenu: showLyrContextMenu
        }
}

and then create the function to create and show your menu

function showLyrContextMenu(view, record, item, index, event){
lyrTreeContextMenu =  new Ext.menu.Menu({
      id : 'lyrcontxtmenu',
      .......
     items: items
      });
      lyrTreeContextMenu.showAt(event.getXY());
      event.stopEvent();
}

Upvotes: 1

Related Questions