PDA

View Full Version : ux.tree.TreeGrid and Ext.tree.TreeNode - not compatible?



Chau
12 Jan 2010, 3:55 AM
I haven't been able to find anything telling me what I am doing wrong, so now I ask here :)

I'm trying to use a TreeGrid and populate it with TreeNode's like in the following:



var tempNode = new Ext.tree.TreeNode({
leaf: false,
attribute: 'Root Node',
value: 'Root Value',
expandable: true,
expanded: true
});

var treeResult = new Ext.ux.tree.TreeGrid({
width: 300,
height: 300,
autoScroll: true,
rootVisible: true,
lines: true,
columns:[{
header: 'Attribute',
dataIndex: 'attribute',
width: 150
},{
header: 'Value',
dataIndex: 'value',
width: 150
}],
root: tempNode
});
The result is a tree with a folder, with the ability to open and close, the two columns Attribute and Value, but no values next to the folder.

I would expect the value "Root Node" next to the folder and the value "Root Value" in the Value column on the same row as the folder icon.

I think that this is a very simple example, so I'm hoping for at very simple answer ;)

Regards, Casper

mjaomaha
18 Feb 2010, 9:24 AM
I have been working with the Ext.ux.tree.TreeGrid, and I can perhaps lead you in the right direction. The Ext.ux.tree.TreeGrid is designed to use a standard treenode, but the trick is that the treenode always uses a ui to paint itself, and by default this ui is treenodeUI, which will not work for the treegrid. The example code that comes with the tree grid uses the Ext.ux.tree.GridLoader, which assigns all the incoming nodes a Ext.us.tree.TreeGridNodeUI. So if you are going to use any old standard treenode, your treenode needs to declare a different UI. It will look something like this.


var tempNode = new Ext.tree.TreeNode({
leaf: false,
attribute: 'Root Node',
value: 'Root Value',
expandable: true,
expanded: true,
uiProvider: Ext.ux.tree.TreeGridNodeUI
});


Hope this helps point you in the right direction. They also have a TreeGridRootNodeUI which may be what you have to use, but I just made my root node not visible, then used TreeGridNodUI for all my child nodes.

Chau
22 Feb 2010, 12:16 AM
@mjaomaha: Thanks for the tips. It really does make sense.

I have avoided most of the previous problems though by using JSON instead - thus no need for me to decide whether to use TreeNode or AsyncTreeNode.

Many thanks for your reply ;)