您的位置:首页 > Web前端 > JavaScript

Extjs 的Tree动态加载

2010-10-04 16:59 387 查看
经过几天的努力,终于搞定了,动态连接数据库加载tree莱单中Node,这个也在网上查了不少资料,可惜啊,基本上都是转载一人之手。看上去很麻烦。咋一看就头晕,功夫不负有心人,我终于找到一个算是简单的方法,但是,还是不好用,还得靠自己啊,最后我把它们的代码综合参考一下,整理之后还算可以,虽然有点乱慢慢看。
数据库表设计
DROP TABLE treenode;
CREATE TABLE treenode (
tid int NOT NULL PRIMARY KEY,
parentid int ,
text char(16) NOT NULL,
href char(32)
);
INSERT INTO treenode (tid, parentid, text, href) VALUES(-100, -100,'01','hello.html');
INSERT INTO treenode (tid, parentid, text, href) VALUES(1, -100,'01','hello.html')
INSERT INTO treenode (tid, parentid, text, href) VALUES(2, -100,'02', 'hello.html')
INSERT INTO treenode (tid, parentid, text, href) VALUES(3, -100,'03', 'hello.html')
INSERT INTO treenode (tid, parentid, text, href) VALUES(4, 1,'04','hello.html')
INSERT INTO treenode (tid, parentid, text, href) VALUES(5, 1,'05','hello.html')
INSERT INTO treenode (tid, parentid, text, href) VALUES(6, 2,'02-01','hello.html')
INSERT INTO treenode (tid, parentid, text, href) VALUES(7, 2,'02-01', 'hello.html')
INSERT INTO treenode (tid, parentid, text, href) VALUES(8, 3,'03-01','hello.html')
INSERT INTO treenode (tid, parentid, text, href) VALUES(9, 3,'03-02','hello.html')
INSERT INTO treenode (tid, parentid, text,href) VALUES(10, 3,'03-03', 'hello.html')
Extjs代码:
Ext.onReady(function(){
var Tree = Ext.tree;
var treeloader=new Tree.TreeLoader({dataUrl:'servlet/TreeAction?TID=-100'});
//定义树的跟节点
var root=new Ext.tree.AsyncTreeNode({
id:"-100",//根节点id
draggable:false,
expanded :true,
text:"后台管理"
});

//生成树形面板
var tree=new Ext.tree.TreePanel({
renderTo:'Tree',
root:root,//定位到根节点
width:150,
height:300,
animate:true,//开启动画效果
enableDD:false,//不允许子节点拖动
autoScroll:true,
loader:treeloader
// border:false,//没有边框
// rootVisible:false//设为false将隐藏根节点,
});

tree.setRootNode(root);
tree.on('beforeload',
function(node){
tree.loader.dataUrl='servlet/TreeAction?TID='+node.id; //定义子节点的Loader
});
tree.render();
root.expand();

});
java代码:

//从数据库中返回父节点id号
String sql="SELECT parentid FROM treenode WHERE parentid>0 Group By parentid Order By parentid";
StringBuilder s= new StringBuilder();
PreparedStatement pst = null;
ResultSet rs = null;
try{
pst = conn.prepareStatement(sql);
rs = pst.executeQuery();

while(rs.next())
{
s.append('|');
s.append(rs.getInt("parentid"));
}
}catch(SQLException e){
e.printStackTrace();
}
return s;
}
//从数据库返回JSONArray字符串对象类
StringBuilder s=this.getResulsetRow(conn);
ArrayList al=new ArrayList();
StringBuilder node=new StringBuilder("[");
String sql="SELECT * FROM treenode WHERE parentid="+pid+" ORDER BY tid";
Statement pst = null;
ResultSet rs = null;
try{
pst = conn.createStatement(ResultSet.TYPE_SCROLL_INSENSITIVE,ResultSet.CONCUR_READ_ONLY);
rs = pst.executeQuery(sql);
rs.last();
int i=rs.getRow();
System.out.println(i);
rs.first();
while(rs.next())
{

String p=String.valueOf(rs.getInt("tid"));
node.append("{id:'"+p+"',text:'"+rs.getString("text").trim()+"',href:'"+rs.getString("href").trim()+"',");
//没有用set和get方法,好像不太好用,这里用了我自己的写法,
// TreeNode td=new TreeNode();
// td.setTid(rs.getInt("tid"));
// td.setText(rs.getString("text").trim());
// td.setHref(rs.getString("href").trim());
if(s.indexOf("|"+p+"|")!=-1){
node.append("cls:'folder',leaf:"+false+"}");
// td.setCls("folder");
// td.setLeaf(false);

}else{

node.append("cls:'file',leaf:"+true+"}");
// td.setCls("file");
// td.setLeaf(true);
}
int row=rs.getRow();
System.out.println(row);
if(row<i){
node.append(",");

}

// al.add(td);
}

} catch(SQLException e){
e.printStackTrace();
}
node.append("]");
return node;
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: