当前位置: 代码迷 >> Ajax >> treeloader数据源
  详细解决方案

treeloader数据源

热度:339   发布时间:2012-04-13 13:50:24.0
treeloader数据源 - Web 开发 / Ajax
怎么通过后台的action把数据传到树的节点,传递的数据格式有没有限制

------解决方案--------------------
Ext.onReady(function(){

Ext.BLANK_IMAGE_URL = "../ext/resources/images/default/s.gif";

var loader = new Ext.tree.TreeLoader({
url: 'result.jsp'
});

var root = new Ext.tree.AsyncTreeNode({
text: '系统功能',
loader: loader
});

var tree = new Ext.tree.TreePanel({
title: '菜单',
width: 200,
height: 200,
renderTo: Ext.getBody(),
root: root // 根节点
});

tree.expandAll();

});

result.jsp:

<%@ page language="java" pageEncoding="utf-8"%>
[
{
text: '产品管理',
children: [
{
text: '增加产品',
listeners:{
'click':function(){
alert('增加产品成功!');
}
},
leaf: true
},
{
text: '维护产品',
href: 'a.jsp',
hrefTarget: 'main',
leaf: true
}
]
},
{
text: '入库单管理',
leaf: true
},
{
text: '用户管理',
leaf: true
}
]

------解决方案--------------------
可以传xml也可以传json的。
JScript code

Ext.onReady(function(){
    // shorthand
    var Tree = Ext.tree;
    
    var tree = new Tree.TreePanel({
        el:'tree-div',
        useArrows:true,
        autoScroll:true,
        animate:true,
        enableDD:true,
        containerScroll: true, 
        loader: new Tree.TreeLoader({
            dataUrl:'get-nodes.jsp'
        })
    });

    // set the root node
    var root = new Tree.AsyncTreeNode({
        text: 'Ext JS',
        draggable:false,
        id:'source'
    });
    tree.setRootNode(root);

    // render the tree
    tree.render();
    root.expand();
});

------解决方案--------------------
使用json-lib
String json = JSONArray.fromObject(beanList).toString();
response.setContentType("text/json;charset=UTF-8");
response.getWriter().println(json);
格式为 [{id: 'a1',text: '节点1',leaf: true},{id: 'a2',text: '节点2',leaf: true}]

request.getParameter("node"); 树异步加载时 这个能得到每次父节点的id 如 a1,a2