how to develop dynamic tree

[cskang]

Hi, i'm trying to come out a dynamic tree ( menus ), i have done the retrive data from database ... the result like below:

1. A
2. A1
3. A1 A
4. A1 B
5. A2
6. A2 A
7. A2 B
8. B
........

but now, how to convert it into extjs tree format?

[
{text:"A",
children:[ {text:'A1', id:'A1', targetUrl:"", leaf:true} ,
{text:'A2', id:'A2', targetUrl:'', leaf:true} ,
......


Please help. thanks

[eXergo]

hello,

I did something like that. I don't know if it's the best way, but here it is:

treePanel


var arboles = new Ext.tree.TreePanel({
useArrows:true,
autoScroll:true,
animate:true,
root: new Ext.tree.TreeNode(
{
text: "Root Node",
expanded: true
}),
rootVisible: false
})



create parentNodes (in my code there are static)


arboles.getRootNode().insertBefore(new Ext.tree.TreeNode({
text: 'parentNode1',
draggable:false,
id:'parentNode1'
}), null);



and I loop over the data I receive ('res') creating childs:


for (var i = 0; i < res.length; i++){
arboles.getNodeById(res[i].parentID).insertBefore(new Ext.tree.TreeNode({
text: res[i].text,
cls: 'x-tree-hd',
draggable:false,
id: res[i].id
}), null);
}

[Condor]

I don't understand the database structure. How would the JSON object generated by your server look?

[cskang]

my database structure:


function_id Function_name is_root menu_layer parent_id
------------------------------------------------------------------
A A Y 0
A1 A1 Y 1 A
A1 A A1 A N 2 A1
A1 B A1 B N 2 A1
A2 A2 Y 1 A
A2 A A2 A N 1 A
B B Y 0
B1 B1 N 1 B
B2 B2 N 1 B

it can more than layer in future. 0 represent a root


Ext.onReady(function(){
var treePanel = new Ext.tree.TreePanel({
id: 'tree-panel',

loader: new Ext.tree.TreeLoader({
dataUrl:'menuTree.do' // load from a html file
}),

root: new Ext.tree.AsyncTreeNode()
});

so, i m using java to write the extjs tree format into the menuTree.html. my problem is, i failed to make it dynamic.

Thanks