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 Premium Member skirtle's Avatar
    Join Date
    Oct 2010
    Location
    UK
    Posts
    3,572
    Answers
    540
    Vote Rating
    309
    skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future

      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 Premium Member skirtle's Avatar
    Join Date
    Oct 2010
    Location
    UK
    Posts
    3,572
    Answers
    540
    Vote Rating
    309
    skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future

      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 Premium Member skirtle's Avatar
    Join Date
    Oct 2010
    Location
    UK
    Posts
    3,572
    Answers
    540
    Vote Rating
    309
    skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future

      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

Turkiyenin en sevilen filmlerinin yer aldigi xnxx internet sitemiz olan ve porn sex tarzi bir site olan mobil porno izle sitemiz gercekten dillere destan bir durumda herkesin sevdigi bir site olarak tarihe gececege benziyor. Sitenin en belirgin ozelliklerinden birisi de Turkiyede gercekten kaliteli ve muntazam, duzenli porno izle siteleri olmamasidir. Bu yuzden iste. Ayrica en net goruntu kalitesine sahip adresinde yayinlanmaktadir. Mesela diğer sitelerimizden bahsedecek olursak, en iyi hd porno video arşivine sahip bir siteyiz. "The Best anal porn videos and slut anus, big asses movies set..." hd porno faketaxi