一个动态加载的树,很多坑,肯定还有改进的空间。(也许java程序员放弃extjs4,资料不多)
先上po
public class TreeNodeVO {
private String id;
private String text;
private String nodetype;
private boolean leaf;
private String hrefTarget;
private String href;
private String cls;
// private boolean checked;
private String parentId;//parentId在extjs3里面我是没写的,这里貌似很重要
getter()....setter()....//自己补充
checked有的话,就是可选的了,尼玛
action代码
public List children;
private boolean success;
public String treenode() {
children = new ArrayList();
TreeNodeVO benz = new TreeNodeVO();
benz.setText("二级菜单目录1");
benz.setCls("folder");
benz.setLeaf(false);
benz.setId("10");
benz.setParentId("1");
children.add(benz);
List bmwList = new ArrayList();
benz.setChildren(bmwList);
benz = new TreeNodeVO();
benz.setText("子菜单2-1");
benz.setCls("file");
benz.setLeaf(true);
benz.setParentId("10");
benz.setId("21");
bmwList.add(benz);
// System.err.println(itemstr);
success=true;
return SUCCESS;
}
这里不用children的话,多重树就不好办了。
struts.xml
<pre class="html" name="code"><action name="treenode" class="treenodeAction" method="treenode">
<result type="json"/>
</action>
spring.xml
<bean id="treenodeAction" class="action.LoginAction"
scope="prototype">
js代码,里面于2个store,一个原来的,一个动态的
Ext.require(['*']);
Ext.onReady(function() {
Ext.QuickTips.init();
var store = Ext.create('Ext.data.TreeStore', {
root : {
expanded : true,
children : [{
text : "detention",
leaf : true
}, {
text : "homework",
expanded : true,
children : [{
text : "book report",
leaf : true
}, {
text : "alegrbra",
leaf : true
}]
}, {
text : "buy lottery tickets",
leaf : true
}]
}
});
var treestore = Ext.create('Ext.data.TreeStore', {
root : {
text : '根节点',
id:'1',
expanded : true
},
autoLoad:true ,
proxy : {
type : 'ajax',
url : './<span style="color: rgb(255, 0, 0);">treenode.action'</span>,
reader : {
type : 'json',
root : '<span style="color: rgb(255, 0, 0);">children</span>'
}
}
});
var treepanel = Ext.create('Ext.tree.Panel', {
store : <span style="color: rgb(255, 0, 0);">treestore,</span>
rootVisible : true
})
Ext.create('Ext.Panel', {
width : "100%",
height : "100%",
layout : 'border',
items : [{
region : 'west',
title : "目录",
width : "20%",
minSize : 175,
maxSize : 400,
collapsible : false,
margins : '0 0 0 5',
layout : 'accordion',
layoutConfig : {
animate : true
},
items : [treepanel]
}, {
region : 'center',
title : 'Column 2',
width : "80%"
}],
renderTo : Ext.getBody()
});
});
好像可以了,哈哈,真坑爹