extjs动态给树节点添加事件

Question

大家好。本人现在有个麻烦请大家帮忙想想该怎么解决，问题是，我在做页面用的是extjs，在加载树节点的时候是从xml文件读取来的。现在主要问题是如果我在xml里面添加一个节点，然后把这个节点的弹出的页面js文件放在工程目录下面，最后我打开页面时点击这个节点就可以打开相应的页面，我不想用if else来判断到底点击哪一个节点。换句话说就是在加载树节点的时候已经给每一个节点分配好弹出页面地址了。不知道这样做怎么实现，请大家帮忙想想思路哈。谢谢了。

Answer 1

那你在xml里面就把url链接地址配置好，加载节点的时候同时把url也拿过来

Answer 2

谢谢大哥了。是不是<shop title="机构管理" name="deptManager" published="" url="www.baidu.com"></shop> 这样？然后var tree = new Ext.tree.TreePanel({
//el:'tree2',
title:'系统菜单',
                animate:true,
                region:'west',  
                autoScroll:true,
                margins : '2 5 5 0',
                animCollapse:true,
                collapsible:true,
                width:230,
                height:570,
                rootVisible: false,
                root: new Ext.tree.AsyncTreeNode(),
                loader: new Ext.app.BookLoader({
             dataUrl:'treedata.xml'
         }),
                containerScroll: true,
                enableDD:true,
                dropConfig: {appendOnly:true},
                listeners:{
                 'click':function(e){
                 if(e.leaf){
                 if(e.id=='deptManager')
                 openControlPanel('deptManager','DeptManager');
                 else if(e.id=='workSystem')
                 openControlPanel('workSystem','WorkSystem');
                 else if(e.id=='workList')
                 openControlPanel('workList','WorkList');
                 else if(e.id=='workIn')
                 openControlPanel('workIn','WorkIn');
                 }
                 }
                }
});在extjs中怎么获得URL对应每一个节点啊？我原来用if else后来我觉得太麻烦了

Answer 3

'click': function(_node, _e) {
//Ext.Msg.alert(_node.attributes.url);
}
试试吧看看你的url能出来不，出来了具体怎么做这个由你了

Answer 4

你这是每个节点对应不同的url吗？ url有固定的格式吗？或者是同一个动态页面，根据id为条件而不同显示呢。

Answer 5

大哥谢谢了，我可以打印出来。但是现在要实现打开一个面板还是不行，不知道为什么在次想请教下你，我都不好意思了。因为初学感觉有点卡的。请大哥多帮忙哈。谢谢我在<shop title="机构管理" name="deptManager" published="" url="/deptManager.js"></shop>
我想点击“机构管理”就执行deptManager.js 这个文件里面是一个面板，但是我不知掉用什么可以打开这个东西。原来是panel = new DeptManager();main.openTab(panel).

Answer 6

如果是直接新页面中显示：
  面板放到页面中去。url去打开页面
如果是在当前页面中建立：
'click': function(_node, _e) {
   createNewPanel(_node.attributes.url);
}
function createNewPanel(url){
   /*这里去自己写个面板并且要写在哪里渲染显示，面板去加载页面（页面里面包含你的js文件）*/}

Answer 7

是啊，每一个节点都对应一个不同的js文件的，我的页面布局就是一个border，点击不同的节点就在中间位置显示不同的东西即js文件

Answer 8

大哥我有一个面板
MainPanel = function() {
    this.openTab = function(panel, id) {
var o = (typeof panel == "string" ? panel : id || panel.id);
var tab = this.getComponent(o);
if(this.getActiveTab()==tab){
return false;
}else if (tab&&this.getActiveTab()!=tab) {
this.setActiveTab(tab);
}else if (typeof panel != "string") {
panel.id = o;
var p = this.add(panel);
this.setActiveTab(p);
}
};
this.closeTab = function(panel, id) {
var o = (typeof panel == "string" ? panel : id || panel.id);
var tab = this.getComponent(o);
if (tab) {
this.remove(tab);
Ext.destroy(tab);
}
};
this.getCurrentEmpInfo = function(){
//   Ext.Ajax.request({
// url : 'getPersonalInfo.action',
// success : function(response, options) {
// var obj = eval('(' + response.responseText + ')');
//                currentLoginEmp = obj;
// }
//
// });
};
MainPanel.superclass.constructor.call(this, {
id : 'main',
region : 'center',
margins : '2 5 5 0',
resizeTabs : true,
minTabWidth : 135,
tbar:['->',
{text:'关闭',
pressed:true,
iconCls:'exit',
handler:function(){
Ext.MessageBox.confirm("警告","您确定要注销吗？",function(button){
                    if(button == "yes")
                    {
                        window.close();
                    }
                }); }},{}],
tabWidth : 135,
enableTabScroll : false,
activeTab : 0,
items : {
id : 'homePage',
title : '主页',
closable : false,
html : '<br><br><center><img src="lct.jpg"/></center>',
autoScroll : true,
tbar:['', {
text : '详细信息',
pressed : true,
handler : function() {
winintro.show(this);
}
}],
listeners : {
'render' : function() {
this.getCurrentEmpInfo();
},
scope : this
}
}
});
};
Ext.extend(MainPanel, Ext.TabPanel);我的所有就只有个jsp页面里面加载了所有的js要怎么动态加载这些URL啊？

Answer 9

点击树支点的时候创建一个tabpanel，tabpanel根据不同url（链接的是新页面）去加载，参考
/*树的单击事件*/
'click': function(_node, _e) {
  createNewPanel(-e.id,_node.attributes.title,_node.attributes.url);
}
/*创建新的tabpanel*/
function createNewPanel(_id,_name,_link)
var tabId = "tab_" + _id;

var tabTitle = _name;

var tabLink = _link;

var centerPanel = Ext.getCmp("main");//这里是你的主面板

var tab = centerPanel.getComponent(tabId);

var subMainId = 'tab_' + _id + '_main';

if (!tab) {
// 动态创建tab
var newTab = centerPanel.add(new Ext.Panel({
id : tabId, 
title : tabTitle, 
layout : 'fit', 
border : false, 
closable : true 
}));

centerPanel.setActiveTab(newTab); newTab.load({
url : tabLink, 
method : "post", 
params : {
subMainId : subMainId
},
scope : this, 
discardUrl : true, 
nocache : true, 
text : "加载中,请稍候……",
timeout : 3000, // 延时3秒
scripts : true

});
} else {
// 激活已存在的tab页
centerPanel.setActiveTab(tab);
}url里面是页面

Answer 10

你的url页面代码，可以放在一个如window中，点击之后，让win显示出来。 这样可以吧。var win = new Ext.Window({});
this.getCurrentEmpInfo = function(){
win.show();
};

Answer 11

呵呵，谢谢了，如果我在<shop title="机构管理" name="deptManager" published="" url="/deptManager.js"></shop>
取出的URL就是deptManager.js，要怎么在页面的中间部分显示出来啊？

Answer 12

我现在重新把问题描述一遍就是，我在点击一个节点添加一个click事件，在click事件中不知道要怎么写可以打开一个面板或者tabpanel？请大家帮忙啊。谢谢诶