ExtJS 4.1控制器处理树节点单击事件

时间:2012-08-24 18:27:32

标签: javascript extjs controller treepanel

遇到麻烦而不确定如何继续调试。找到一个看起来几乎与我一样的问题,但解决方案不起作用:How to catch tree node clicks from a (MVC) controller in ExtJs 4?

我可以在这个问题和我的问题之间看到的唯一区别是我的树在我的布局中直接使用xtype treepanel Ext.define("IOL.controller.app.AppLayout", { extend: 'Ext.app.Controller', init: function() { this.control({ 'app toolbar > button[itemId=filter]' : { click: this.onFilter }, 'menuTree': { itemclick: this.onFilter } }); }, onFilter: function(btn) { alert('test'); Ext.create('IOL.view.app.Home').show(); } }); 作为项目对象创建,其中一个是单独创建的。

这是我的控制器:

{
        xtype: 'treepanel',
        title: 'Navigation',
        split: true,
        collapsible: true,
        margins: '5 0 5 5',
        region: 'west',
        width: 170,
        id: 'menuTree',
        alias: 'widget.menuTree',
        store: Ext.create('IOL.store.app.AppNav'),
        useArrows: true,
        rootVisible: false
        /*listeners : {
            itemdblclick : function(view,rec,item,index,eventObj) {

                console.log(view);
                console.log(rec);
                console.log(item);
                console.log(index);
                console.log(eventObj);
                if(rec.get('leaf') == true){
                    Ext.ComponentQuery.query('tabpanel')[0].add({
                        xtype: 'panel',
                        title: rec.get('text'),
                        itemId: rec.get('id'),
                        //url: 'server/HomeTab/read.php',
                        html : 'test content name: ' + rec.get('id'),
                        closable : true
                    });
                }

            }
        }*/
    }

以下是我认为的相关项目:

app toolbar > button[itemId=filter]

按钮Ext.getCmp('menuTree')的控件有效,但是为'menuTree'指定相同的操作不起作用。浏览器控制台带回.on('click')的有效对象,所以我很遗憾控制器似乎没有在树上行动。

树正在从商店加载,这让我想知道这是否与jQuery中需要使用.click()而不是{{1}}的类似情况...几乎就像控制器一样没有看到树(但在同一视图中看到按钮?)。我故意直接在树上注释掉处理程序(这确实有用)。

如果能提供帮助,可以提供所有文件。

1 个答案:

答案 0 :(得分:4)

Ext.getCmp()按 id 返回组件,而控制器使用Ext.ComponentQuery.query()语法查找其组件;所以你有效地尝试使用不存在的xtype menuTree来控制组件。您应该使用'#menuTree'或'treepanel'作为选择器。