Extjs 6 + Tree List add click event

[mickarea]

Hi,

I'm using this example for my applications :

http://examples.sencha.com/extjs/6.0...ink/#tree-list

I would like to know where I've to put my listener to detect the click on an item in the tree.

Thx you,

[mickarea]

In the viewModel, I can't find where I can detect a click on a leaf of the tree node :

Ext.define('KitchenSink.view.tree.TreeListModel', {
    extend: 'Ext.app.ViewModel',


    alias: 'viewmodel.tree-list',


    formulas: {
        selectionText: function(get) {
            var selection = get('treelist.selection'),
                path;
            if (selection) {
                path = selection.getPath('text');
                path = path.replace(/^\/Root/, '');
                return 'Selected: ' + path;
            } else {
                return 'No node selected';
            }
        }
    },


    stores: {
        navItems: {
            type: 'tree',
            root: {
                expanded: true,
                children: [{
                    text: 'Home',
                    iconCls: 'x-fa fa-home',
                    children: [{
                        text: 'Messages',
                        iconCls: 'x-fa fa-inbox',
                        leaf: true
                    },{
                        text: 'Archive',
                        iconCls: 'x-fa fa-database',
                        children: [{
                            text: 'First',
                            iconCls: 'x-fa fa-sliders',
                            leaf: true
                        },{
                            text: 'No Icon',
                            iconCls: null,
                            leaf: true
                        }]
                    },{
                        text: 'Music',
                        iconCls: 'x-fa fa-music',
                        leaf: true
                    },{
                        text: 'Video',
                        iconCls: 'x-fa fa-film',
                        leaf: true
                    }]
                },{
                    text: 'Users',
                    iconCls: 'x-fa fa-user',
                    children: [{
                        text: 'Tagged',
                        iconCls: 'x-fa fa-tag',
                        leaf: true
                    },{
                        text: 'Inactive',
                        iconCls: 'x-fa fa-trash',
                        leaf: true
                    }]
                },{
                    text: 'Groups',
                    iconCls: 'x-fa fa-group',
                    leaf: true
                },{
                    text: 'Settings',
                    iconCls: 'x-fa fa-wrench',
                    children: [{
                        text: 'Sharing',
                        iconCls: 'x-fa fa-share-alt',
                        leaf: true
                    },{
                        text: 'Notifications',
                        iconCls: 'x-fa fa-flag',
                        leaf: true
                    },{
                        text: 'Network',
                        iconCls: 'x-fa fa-signal',
                        leaf: true
                    }]
                }]
            }
        }
    }
});

[TampaBay55]

I didn't see the code for the treepanel but I would think that on the panel you would need to set a listener on the "select" event.

[mickarea]

Thx, but I don't see where is the tree list component in that :

{
        region:'west', 
       width:250,
        split:true,
        reference:'treelistContainer', 
       layout:{            
           type:'vbox',
            align:'stretch'},
        border:false,
        scrollable:'y',
        items:[{            xtype:'treelist',            reference:'treelist',            bind:'{navItems}'}]   
 }

[TampaBay55]

Not sure what you are attempting here but:

Ext.create('Ext.tree.Panel', {
    title: 'Simple Tree',
    width: 200,
    height: 200,
    store: store,
    rootVisible: false,
    renderTo: Ext.getBody(),
    listeners:
        select: 'treeNodeSelect'
    }
});

In your viewcontroller:

treeNodeSelect: function(tree,record,ndx,opts){
    //Do Something Here With The Selected Node
}