树节点组合模型package cn.com.jsnh.model.catalog;public class TreeModel { private String node; private CatalogModel model; public String getNode() { return node; } public void setNode(String node) { this.node = node; } public CatalogModel getModel() { return model; } public void setModel(CatalogModel model) { this.model = model; }}栏目模型【实际的树节点】package cn.com.jsnh.model.catalog;public class CatalogModel { private String id; private String text; private Boolean leaf; private String cls; private String action; private String model; public String getId() { return id; } public void setId(String id) { this.id = id; } public String getText() { return text; } public void setText(String text) { this.text = text; } public Boolean getLeaf() { return leaf; } public void setLeaf(Boolean leaf) { this.leaf = leaf; } public String getCls() { return cls; } public void setCls(String cls) { this.cls = cls; } public String getAction() { return action; } public void setAction(String action) { this.action = action; } public String getModel() { return model; } public void setModel(String model) { this.model = model; }}<%@ page import="java.util.*, cn.com.jsnh.model.catalog.TreeModel, cn.com.jsnh.model.catalog.CatalogModel, net.sf.json.JSONObject, net.sf.json.JSONArray, net.sf.ezmorph.bean.MorphDynaBean" contentType="text/html;charset=utf-8"%><%try{ String node = request.getParameter("node"); System.out.println("node="+node); List<TreeModel> tree = new ArrayList<TreeModel>(); TreeModel treeModel = new TreeModel(); CatalogModel catalogModel = new CatalogModel(); catalogModel.setId("100000"); catalogModel.setText("个人管理专区"); catalogModel.setLeaf(Boolean.FALSE); catalogModel.setCls("folder"); catalogModel.setAction("100000"); catalogModel.setModel("100000"); treeModel.setNode("root"); treeModel.setModel(catalogModel); tree.add(treeModel); treeModel = new TreeModel(); catalogModel = new CatalogModel(); catalogModel.setId("100001"); catalogModel.setText("修改我的资"); catalogModel.setLeaf(Boolean.TRUE); catalogModel.setCls("file"); catalogModel.setAction("x.action"); catalogModel.setModel("user"); treeModel.setNode("100000"); treeModel.setModel(catalogModel); tree.add(treeModel); treeModel = new TreeModel(); catalogModel = new CatalogModel(); catalogModel.setId("100002"); catalogModel.setText("个人消息"); catalogModel.setLeaf(Boolean.TRUE); catalogModel.setCls("file"); catalogModel.setAction("x.action"); catalogModel.setModel("message"); treeModel.setNode("100000"); treeModel.setModel(catalogModel); tree.add(treeModel); List<CatalogModel> catalogList = new ArrayList<CatalogModel>(); for(TreeModel o:tree){ if(o.getNode().equals(node)){ catalogList.add(o.getModel()); } } JSONArray json = JSONArray.fromObject(catalogList); response.getWriter().write(json.toString()); } catch(Exception ex) {}%><html xmlns="http://www.w3.org/1999/xhtml"><head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/> <title>后台框架演示</title> <link rel="stylesheet" type="text/css" href="../extjs/resources/css/ext-all.css"/> <link rel="stylesheet" type="text/css" href="css/common.css"/> <script type="text/javascript" src="../extjs/adapter/ext/ext-base.js"></script> <script type="text/javascript" src="../extjs/ext-all.js"></script> <script type="text/javascript" src="../extjs/ext-lang-zh_CN.js"></script> <script type="text/javascript" src="script/common.js"></script> <script type="text/javascript" src="script/json/json.js"></script> <script type="text/javascript" src="script/json/json2.js"></script></head><body><script type="text/javascript">var Tree = Ext.tree;var root = new Tree.AsyncTreeNode({ text: 'Ext JS', draggable:false, id:'root', children:[{//子节点 text:'loading',//显示文字为loading iconCls: 'loading',//使用图标为loading 在index.html style 中定义 leaf:true//是叶子节点,不再包含子节点 }] });var treeLoader=new Ext.tree.TreeLoader();//指定一个空的TreeLoadervar tree = new Ext.tree.TreePanel({ contentEl:'west', border:true, root:root, region:'west', id:'west-panel', split:true, width: 200, minSize: 175, maxSize: 400, margins:'0 0 0 0', layout:'accordion', title:'功能菜单', collapsible :true, layoutConfig:{ animate:true }, rootVisible:true, autoScroll:true, loader:treeLoader });tree.on('click',treeClick);//tree.expandAll();var tab = new Ext.TabPanel({ region:'center', deferredRender:false, activeTab:0, items:[{ contentEl:'center2', title: '首页', autoScroll:true }]});function treeClick(node,e) { if(node.isLeaf()){ e.stopEvent(); var n = tab.getComponent(node.id); if (!n) { var n = tab.add({ 'id' : node.id, 'title' : node.text, closable:true, html : '<iframe scrolling="auto" frameborder="0" width="100%" height="100%" src="index.php?model='+node.attributes.model+'&action='+node.attributes.action+'"></iframe>' }); } tab.setActiveTab(n); }}function newTab(id,text,url) { var n = tab.getComponent(id); if (!n) { var n = tab.add({ 'id' : id, 'title' : text, closable:true, html : '<iframe scrolling="auto" frameborder="0" width="100%" height="100%" src="'+url+'"></iframe>' }); } tab.setActiveTab(n);}function gettree(node){ if(node.firstChild.text=='loading'){ var par = node.id; //alert('par='+par); Ext.Ajax.request({ url: 'jsonTree.jsp', params: {node:par}, method: 'GET', success: function(v){ //成功返回 var myData = JSON.parse(v.responseText); // 得到服务器返回的json串，并用json.js解析过对象数组 for(var i=0;i<myData.length;i++ ){ var cnode=new Ext.tree.AsyncTreeNode({ id:myData<i>.id,//id 为服务器返回id 父节点id text:myData<i>.text,//显示内容为服务器返回id 父节点id leaf:myData<i>.leaf,//是否为叶子节点,根据服务器返回内容决定是否为叶子节点 children:[{//添加子节点,如果服务器返回tl<i>.leaf为ture则孩子节点将无法显示 text:'loading', iconCls: 'loading', leaf:true }] }); cnode.on('expand',gettree);//定义当前节点展开时调用gettree方法,再次异步读取子节点 node.appendChild(cnode);//将当前节点添加为待展开节点子节点 } node.firstChild.remove();//删除当前节点第一个孩子节点(loading节点) }, failure: function2 // 失败 }); } } function function2(){ alert("failure"); }Ext.onReady(function(){ var viewport = new Ext.Viewport({ layout:'border', items:[ new Ext.BoxComponent({ region:'north', el: 'north', height:35 }), tree, tab ] }); tree.render(); root.on('expand',gettree);//当根节点展开后触发gettree事件 //root.expand(); loadend();});function openWindow(id,title,url,width,height){ var win = Ext.get(id) if (win) { win.show(); return; } win = new Ext.Window({ id:id, title:title, layout:'fit', width:width, height:height, closeAction:'close', collapsible:true, plain: true, html : '<iframe frameborder="0" width="100%" height="100%" src="'+url+'"></iframe>' }); win.show();}</script><div id="north"> <p class="api-title">MYOIS 1.0 Office Information System</p></div><div id="west"></div><div id="center2">center2</div><div id="loading-mask" style=""></div><div id="loading"> <div class="loading-indicator"><img src="images/loading.gif" width="32" height="32" style="margin-right:8px;" align="absmiddle"/>Loading... </div></div></body></html>
原文地址:http://www.zhuoda.org/lunzi/102821.html
