View Full Version : [CLOSED]Tree Bugs

James Goddard
18 Mar 2011, 4:23 AM
1. icon and iconCls are ignored on tree nodes.
2. expandAll/collapseAll are missing
3. There is no way to programatically add a node to a tree (without calling undocumented functions marked private). Presumably you are aware of this since the tree drop zone has the code to do this commented out.

25 Mar 2011, 4:18 AM
I can confirm 1.) here. The icon property is completely ignored. The "iconCls" property is added,
but in the wrong order. TreeNodes appears as:

<img class="x-tree-icon x-tree-icon-parent yourcustomclass" src="data:image/gif;base64,R0lGODlhAQABAID/AMDAwAAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==">

Add !important to the iconCls is a workaround.

James Goddard
25 Mar 2011, 6:32 AM
1 was partially fixed in PR5. You always needed important on it IIRC.

25 Mar 2011, 6:00 PM
1. This should have been fixed in PR5
2. This will be part of the beta release
3. treeStore.getRootNode().appendChild({text: 'Child'}); We need to add better documentation for this. You can find all node methods in NodeInterface.

28 Mar 2011, 4:26 AM

see screenshot: 25379

TEST node was a part of the TreePanel store load process.
'new node' was added with appendChild() with unique id.
TEST node is duplicated now on screen, while in the debugger I see correct data. I.e. Root node has 2 childrens. Some rendering bug.

28 Mar 2011, 8:47 AM
You can find all node methods in NodeInterface.
The documentation for NodeInterface isn't there.

James Goddard
28 Mar 2011, 10:31 AM
How would I force a reload of the tree. I've tried calling load on the store and setting a new root node, neither of which work.

28 Mar 2011, 12:19 PM
That has been fixed for the next release.

In the next release setting clearOnLoad to true on the TreeStore will automatically reload the tree every time you call load.

28 Mar 2011, 1:23 PM
just a question - in TYPO3 we use the tree for displaying pages, which can easily be 20000+
There a big complains about the performance on load from users.
has the new tree better performance because of the store organizing or is it the same?
Did you some performance improvements for that many nodes beeing rendered?
Thanks in advanced.

28 Mar 2011, 1:32 PM
Since Tree now extends Grid and it uses a DataView the nodes will all be injected at once. That might speed it up a little bit, but 20000 DOM nodes would still take quite some time to render.

We are looking into adding support for buffered rendering on Tree just like we do for Grid, in which case you can have an unlimited amount of nodes in the tree without it affecting the performance.

28 Mar 2011, 1:43 PM
thanks for the info Tommy!
Of course the 20000+ are not visible always as you have collapsed nodes. But there is a feature "collapse all" or "collapse branch" which is of course a killer with this amount.
A buffer would really be a big help!

29 Mar 2011, 7:20 AM
A fifteen pixel space appears to be reserved to the right of all nodes to accommodate header spacing, even when no headers are defined and hideHeaders is set to true. It shows up as fifteen pixels of unhighlighted space to the right of hovered or selected nodes. In other words, node highlighting does not extend to the boundary of the tree's container, even when there are no headers.

Ext.onReady(function() {
var tree = Ext.create('Ext.tree.TreePanel', {
width: 500,
height: 300,
renderTo: Ext.getBody(),
hideHeaders: true,
root: false

30 Mar 2011, 6:25 PM
The reserved space is for a scrollbar, not headers.

James Goddard
1 Apr 2011, 10:29 AM
In the next release setting clearOnLoad to true on the TreeStore will automatically reload the tree every time you call load.

Still doesn't work. When I call load on the tree's store, it does clear the old nodes and loads the new data but it never adds the new nodes to the tree.

1 Apr 2011, 10:57 AM
The reserved space is for a scrollbar, not headers.
Right, I realized that after my post. Node highlights don't extend to the edge of the container because of the reserved space though, and I think that should be considered buggy.

9 May 2011, 10:21 AM
Is there any news about this? A buffered Tree will be great!

12 Oct 2011, 6:48 AM
Also for me this bug is not resolved!
Please could someone give an answer abuot it?

I have opened this tread : http://www.sencha.com/forum/showthread.php?150539-TreeStore-doesn-t-load-new-node-on-TreeGrid-!!!-It-s-a-bug-Please-help!

And here I report the text,because it refer to this problem.


I want to do this.
Using the Desktop example application given in the Extjs 4 ,I have created a Treegrid that load in a store the data from a Mysql db using Json and Ajax, and then display them on the treegrid.
I have also created a new FormPanel from where I want to insert new values, that must be send to the db ,via Ajax ,and then I want to load the store of the treegrid so I can see the new data showed.

The store DOESN'T show the new data!!!:-?

I have try in many many ways but nothing.......

It happen that the store refreshing visually, but it give only all the old data on the grid,not the new data.

I put here the code:


xtype: 'button',
text : 'Enter',
handler: function() {
data = Ext.getCmp('dataid').getValue();
user = Ext.getCmp('userid').getValue();
text = Ext.getCmp('textid').getValue();
var dati = [data,text,user];
url: 'nuovo_db_json.php',
params: {
data: Ext.encode(dati)
var desktop2 = myDesktopApp.desktop.app.getDesktop();
var win2 = desktop2.getWindow('ToDoNew');
var tree = win2.getComponent('todotreeid');
var store = tree.getStore();

I have solved how to do the comunications between two modules in Desktop application example Extjs 4.
Basically you have to instantiate a new dektop object inside the code of your application taking him from the method getDesktop() in the desktop code.
Then you have to take the window modules you want by using the method getWindow,and the id of the window you want, from the new desktop object.

Then you cand do what you want on the new window (win2),but the refresh of the store doesn't go.

PS - I have notice doing a 'double' load of the store (store.load();store.load(); ) that the new data ARE displayed in the treegrid BUT in queue of the old data ,like to repeat the two treegrid list,one with old data and the other with new data....so is like that the store.load goes but only in 'second time'.......)

Someone has some idea?




Could someone have some idea of this?

Thanks a lot!


12 Oct 2011, 6:51 AM
I have also set clearOnLoad to true, but the store.load() doesn't reload nothing ...only show the old data!

I report here that doing a double load() ,the treegrid show a 'double list' af nodes and in the top list the new node is shown...but why this????


12 Oct 2011, 7:58 AM
Korax is RIGHT!!!

Now I have seen that the store.load() is OK and the new node is loaded!

The problem is that when the treegrid is redrawned it keep the scrollbar to the same misure of the precedent draw,so the new node is not showed!!!

If you try to pickup the bottom limit of the treepanel and strecht with the mouse down ,you will see the new node appear!!!

Now,HOW TO RESOLVED this problem???

Thanks a lot.

19 Oct 2011, 1:03 AM
Searching in the web I have found a discussion that resolved my problem.
I write here the solution but I think that the REAL abd DEFINITIVE solution is to be set by the Sencha Team.
This could be an idea...;)

The site : http://stackoverflow.com/questions/7...-4-not-working (http://stackoverflow.com/questions/7564527/grid-panel-scrollbars-in-extjs-4-not-working)

The solution for me was to set in the TreePanel the Vieconfig with these data:


style:{ overflow: 'auto', overflowX: 'hidden' }