ExtJS TreePanel
ExtJS的Treepanel 经常被使用到，这里我写了一颗树。上面的数据用json从后台打回来到前台就可以使用。这颗树的json数据里面有部分属性没有用到，请大家使用的时候自己去掉。
var treeMenu = [ {
"id" : 370,
"valid" : true,
"createTime" : "2011-07-22 00:00:00",
"text" : "小型超市商务平台",
"nodeId" : "132",
"parentNodeId" : "0",
"cls" : "folder",
"sortId" : 100,
"link" : "#",
"children" : [ {
"id" : 371,
"valid" : true,
"createTime" : "2011-07-22 00:00:00",
"text" : "销售",
"nodeId" : "133",
"parentNodeId" : "132",
"cls" : "folder",
"sortId" : 1,
"link" : "#",
"children" : [ {
"id" : 376,
"valid" : true,
"createTime" : "2011-07-26 00:00:00",
"text" : "当前销售",
"nodeId" : "138",
"parentNodeId" : "133",
"cls" : "file",
"sortId" : 1,
"link" : "/jsp/",
"children" : [],
"validValue" : 0,
"leaf" : true
}, {
"id" : 377,
"valid" : true,
"createTime" : "2011-07-26 00:00:00",
"text" : "销售记录",
"nodeId" : "139",
"parentNodeId" : "133",
"cls" : "file",
"sortId" : 10,
"link" : "/jsp",
"children" : [],
"validValue" : 0,
"leaf" : true
} ],
"validValue" : 0,
"leaf" : false
}, {
"id" : 372,
"valid" : true,
"createTime" : "2011-07-22 00:00:00",
"text" : "进货",
"nodeId" : "134",
"parentNodeId" : "132",
"cls" : "folder",
"sortId" : 10,
"link" : "#",
"children" : [],
"validValue" : 0,
"leaf" : false
}, {
"id" : 373,
"valid" : true,
"createTime" : "2011-07-22 00:00:00",
"text" : "仓储",
"nodeId" : "135",
"parentNodeId" : "132",
"cls" : "folder",
"sortId" : 20,
"link" : "#",
"children" : [],
"validValue" : 0,
"leaf" : false
}, {
"id" : 374,
"valid" : true,
"createTime" : "2011-07-22 00:00:00",
"text" : "结余",
"nodeId" : "136",
"parentNodeId" : "132",
"cls" : "folder",
"sortId" : 30,
"link" : "#",
"children" : [],
"validValue" : 0,
"leaf" : false
} ],
"validValue" : 0,
"leaf" : false
}, {
"id" : 368,
"valid" : true,
"createTime" : "2000-01-01 00:00:00",
"text" : "系统管理",
"nodeId" : "6",
"parentNodeId" : "0",
"cls" : "folder",
"sortId" : 999999,
"link" : "#",
"children" : [ {
"id" : 378,
"valid" : true,
"createTime" : "2011-07-26 00:00:00",
"text" : "后台管理-管理员",
"nodeId" : "140",
"parentNodeId" : "6",
"cls" : "folder",
"sortId" : 999,
"link" : "#",
"children" : [ {
"id" : 379,
"valid" : true,
"createTime" : "2011-07-26 00:00:00",
"text" : "个人信息",
"nodeId" : "141",
"parentNodeId" : "140",
"cls" : "file",
"sortId" : 1,
"link" : "/jsp/",
"children" : [],
"validValue" : 0,
"leaf" : true
} ],
"validValue" : 0,
"leaf" : false
}, {
"id" : 7,
"valid" : true,
"createTime" : "2009-04-07 00:00:00",
"text" : "后台管理-<span style='color:red;'>超级管理员<\/span>",
"nodeId" : "1",
"parentNodeId" : "6",
"cls" : "folder",
"sortId" : 900000,
"link" : "#",
"children" : [ {
"id" : 49,
"valid" : true,
"createTime" : "2009-06-05 00:00:00",
"text" : "菜单树管理",
"nodeId" : "5",
"parentNodeId" : "1",
"cls" : "file",
"sortId" : 0,
"link" : "/direct/menuTree.do",
"children" : [],
"validValue" : 0,
"leaf" : true
}, {
"id" : 103,
"valid" : true,
"createTime" : "2009-07-14 00:00:00",
"text" : "用户管理",
"nodeId" : "122",
"parentNodeId" : "1",
"cls" : "file",
"sortId" : 10,
"link" : "/direct/user/manage.do",
"children" : [],
"validValue" : 0,
"leaf" : true
}, {
"id" : 375,
"valid" : true,
"createTime" : "2011-07-26 00:00:00",
"text" : "用户组管理",
"nodeId" : "137",
"parentNodeId" : "1",
"cls" : "file",
"sortId" : 15,
"link" : "/jsp/",
"children" : [],
"validValue" : 0,
"leaf" : true
}, {
"id" : 107,
"valid" : true,
"createTime" : "2010-01-07 00:00:00",
"text" : "用户组分配",
"nodeId" : "131",
"parentNodeId" : "1",
"cls" : "file",
"sortId" : 20,
"link" : "/jsp/background_management/adminUserGroup.jsp",
"children" : [],
"validValue" : 0,
"leaf" : true
}, {
"id" : 105,
"valid" : true,
"createTime" : "2010-01-07 00:00:00",
"text" : "权限组管理",
"nodeId" : "129",
"parentNodeId" : "1",
"cls" : "file",
"sortId" : 40,
"link" : "/jsp/background_management/addAuthGroup.jsp",
"children" : [],
"validValue" : 0,
"leaf" : true
}, {
"id" : 20,
"valid" : true,
"createTime" : "2009-04-28 00:00:00",
"text" : "用户权限管理",
"nodeId" : "2",
"parentNodeId" : "1",
"cls" : "file",
"sortId" : 50,
"link" : "/jsp/background_management/admin.jsp",
"children" : [],
"validValue" : 0,
"leaf" : true
}, {
"id" : 106,
"valid" : true,
"createTime" : "2010-01-07 00:00:00",
"text" : "组权限分配",
"nodeId" : "130",
"parentNodeId" : "1",
"cls" : "file",
"sortId" : 60,
"link" : "/jsp/background_management/adminAuthGroup.jsp",
"children" : [],
"validValue" : 0,
"leaf" : true
} ],
"validValue" : 0,
"leaf" : false
} ],
"validValue" : 0,
"leaf" : false
} ];
/**
* 左边的树
*/
var westObj = {
id : 'menuTree',
region : 'west',
collapsible : true,
animate : true,
title : CommonUtils.language.treeTitle,
xtype : 'treepanel',
width : 200,
autoScroll : true,
split : true,
loader : new Ext.tree.TreeLoader(),
root : new Ext.tree.AsyncTreeNode( {// 树根
id : 'rootTreeId',
text : CommonUtils.language.projectName,
iconCls : 'treeNodeStyle',
expanded : true,
children : treeMenu
}),
rootVisible : true,// 根节点的可见性
listeners : {// 点击后调用的方法
click : function(n) {
// 如果是叶子节点并且点击的不是olap菜单
if (n.isLeaf()) {
var tabTitle = n.attributes.text;
var targetUrl = basePath + n.attributes.link;
addTab(n.attributes.id, tabTitle, targetUrl);
} else {
if (n.isExpanded()) {// 树节点的开关
n.collapse(false, true);
}
}
}
}
};