1. #1
    Sencha User
    Join Date
    Oct 2010
    Posts
    13
    Vote Rating
    0
    Hari1611 is on a distinguished road

      0  

    Question Answered: Ext 4 Treepanel context menu not showing at target

    Answered: Ext 4 Treepanel context menu not showing at target


    Ext 4 treepanel context menu not showing at the target node.. My code is as below.. Please anybody help me to resolve it.

    var onContextMenu = function (view, record, item, index, e) {
    var selNode = record;
    if (Ext4.getCmp("mainContext") != null) {
    Ext4.getCmp("mainContext").destroy();
    }
    var menu = createContextMenu(selNode);
    e.preventDefault();
    menu.showAt(item);
    }

    var tree = Ext4.create('Ext4.tree.Panel', {
    animate: true,
    enableDD: true,
    id: "filterTree",
    border: false,
    renderTo: self.containerId,
    store: treeStore,
    rootVisible: false,
    layout: {
    type: 'fit',
    padding: '5',
    align: 'left'
    },
    listeners: {
    afterrender: function () {
    this.getEl().setStyle('height', 'auto');
    this.body.setStyle('height', 'auto');
    this.getView().getEl().setStyle('height', 'auto');
    }
    }
    });
    tree.on('itemcontextmenu', onContextMenu);

    Whats wrong with this code??

  2. Please use CODE tags when posting code (# button on the editor toolbar).

    I believe the problem is with your showAt(). See the example here:

    http://docs.sencha.com/ext-js/4-0/#!...-method-showAt

  3. #2
    Sencha User skirtle's Avatar
    Join Date
    Oct 2010
    Location
    UK
    Posts
    3,338
    Answers
    498
    Vote Rating
    248
    skirtle has much to be proud of skirtle has much to be proud of skirtle has much to be proud of skirtle has much to be proud of skirtle has much to be proud of skirtle has much to be proud of skirtle has much to be proud of skirtle has much to be proud of skirtle has much to be proud of skirtle has much to be proud of

      0  

    Default


    Please use CODE tags when posting code (# button on the editor toolbar).

    I believe the problem is with your showAt(). See the example here:

    http://docs.sencha.com/ext-js/4-0/#!...-method-showAt

  4. #3
    Sencha User
    Join Date
    Oct 2010
    Posts
    13
    Vote Rating
    0
    Hari1611 is on a distinguished road

      0  

    Thumbs up Works fine

    Works fine


    Works fine!
    But i have to render the menu to the body on creation and specify the floating : false

    I need to show the menu on the icon of the tree node, earlier with ext 3.0 it can be done with
    Code:
    menu.show(selectedNode.ui.getIconEl());
    selectedNode.ui.getIconEl() is missing in Ext 4

    How can i do it?? Any suggestion??

  5. #4
    Sencha User skirtle's Avatar
    Join Date
    Oct 2010
    Location
    UK
    Posts
    3,338
    Answers
    498
    Vote Rating
    248
    skirtle has much to be proud of skirtle has much to be proud of skirtle has much to be proud of skirtle has much to be proud of skirtle has much to be proud of skirtle has much to be proud of skirtle has much to be proud of skirtle has much to be proud of skirtle has much to be proud of skirtle has much to be proud of

      0  

    Default


    But i have to render the menu to the body on creation and specify the floating : false
    Why?

    selectedNode.ui.getIconEl() is missing in Ext 4
    Just do a suitable DomQuery down from the item (the third argument of your handler).

    I also think you're going to need showBy() rather than show():

    http://docs.sencha.com/ext-js/4-0/#!...-method-showBy

  6. #5
    Sencha User
    Join Date
    Oct 2010
    Posts
    13
    Vote Rating
    0
    Hari1611 is on a distinguished road

      0  

    Question Get Icon Element of the each node in the tree??

    Get Icon Element of the each node in the tree??


    How can i get the icon element of each node in the tree??

    If i didnt specify
    Code:
    floating:false
    then menu will be shown like this

    tree.JPG

    Any idea why is it so?

  7. #6
    Sencha User skirtle's Avatar
    Join Date
    Oct 2010
    Location
    UK
    Posts
    3,338
    Answers
    498
    Vote Rating
    248
    skirtle has much to be proud of skirtle has much to be proud of skirtle has much to be proud of skirtle has much to be proud of skirtle has much to be proud of skirtle has much to be proud of skirtle has much to be proud of skirtle has much to be proud of skirtle has much to be proud of skirtle has much to be proud of

      0  

    Default


    How can i get the icon element of each node in the tree??
    As already mentioned, you need to use a DomQuery. It'd be something like this:

    Code:
    Ext.fly(item).down('.x-tree-icon')
    As for the floating problem, it's difficult to guess what the problem is without seeing the config for your menu. Make sure you don't have a renderTo option.

  8. #7
    Sencha User
    Join Date
    Oct 2010
    Posts
    13
    Vote Rating
    0
    Hari1611 is on a distinguished road

      0  

    Default


    Code:
    var menu = Ext4.create('Ext4.menu.Menu', {
                id: 'mainContext',
                floating: false,
                renderTo: Ext4.getBody(),
                width: 100,
                items: [{ text: 'Create Group',
                    hidden: selNode.isLeaf() ? true : false,
                    id: 'createGroup',
                    handler: function () {
                        
                },
                {
                    hidden: selNode.isLeaf() ? true : false,
                    text: 'Rename Group',
                    id: 'editGroup',
                    handler: function () {
                       
                },
                {
                    hidden: selNode.isLeaf() || selNode.raw.isGroup == 2 ? true : false,
                    text: 'Delete Group',
                    id: 'deleteGroup',
                    handler: function () {
                        
                    }
                },
                {
                    text: 'Create Filter',
                    id: 'createFilter',
                    handler: function () {
                      
                    }
                },
                {
                    hidden: selNode.isLeaf() ? false : true,
                    text: 'Edit Filter',
                    id: 'editFilter',
                    handler: function () {
                     
                    }
                },
                {
                    hidden: selNode.isLeaf() ? false : true,
                    text: 'Delete Filter',
                    id: 'deleteFilter',
                    handler: function () {
                        
                    }
                },
                {
                    hidden: selNode.raw.isGroup == 2 ? false : true,
                    text: 'Cancel filter',
                    id: 'cancelFilter',
                    handler: function () {
                       
                    }
                },
                {
                    hidden: selNode.raw.isGroup == 2 ? false : true,
                    text: 'Refresh Tree',
                    id: 'refreshTree',
                    handler: getData
                }]
            });
    When the highlighted code is removed the menu is not showing any where..

    In between im using ext 4 sandbox for creating the tree..

Thread Participants: 1

Tags for this Thread

film izle

hd film izle

film sitesi

takipci kazanma sitesi

takipci kazanma sitesi

güzel olan herşey

takipci alma sitesi

komik eğlenceli videolar