PDA

View Full Version : [INFOREQ] TreeStore autoLoad / rendering bug



elasticsystems
17 Mar 2011, 11:52 AM
Hi,

I'm using the new TreeStore and TreePanel (as shown in the examples folder) within a TabPanel layout in PR4, and have been getting the error "TypeError: Result of expression 'callback' [undefined] is not an object." in my Safari console from line 24987 in ext-all-debug.js (Firebug also shows the equivalent error).

If I add something like sleep(5) to delay the script returning data to the TreeStore, and ensure that the TreePanel is visible before the data is returned to the TreeStore (by activating the parent TabPanel), no error occurs and the tree works as expected.

I tried using autoLoad: false on the TreeStore to defer loading until the TreePanel was visible, but that parameter appears to have no effect.

Cheers!
Richard

4CastRisk
17 Mar 2011, 12:07 PM
Can confirm I have the same issue, not loading but passing an object as the root parameter of the TreeStore.

Everything works up to the point of trying to create a TreePanel with the following code:



data =
text: '.'
children: [
_id: 'khjkkjjknkjjnkjk'
name: 'Organisation'
children: [
_id: 'oidjfiogjwiogjeoi'
name: 'Office 1'
children: [
_id: 'kjefklwflkwefjwelf'
name: 'Department 1'
children: [
_id: 'jg394jg3gj34og34'
name: 'Role 1'
leaf: yes
,
_id: 'fnsadjfsadkfbsadfs'
name: 'Role 2'
leaf: yes
]
]
,
_id: 'kdnflkwnfg3434g34'
name: 'Office 2'
children: [
_id: 'nvmwrvno3kjnvo34in3o4'
name: 'Role 3'
]
]
]

Ext.regModel 'OrganisationItems',
idProperty: '_id'
fields: [
{ name: '_id', type: 'string' }
{ name: 'name', type: 'string' }
]


store = new Ext.data.TreeStore
model: 'OrganisationItems'
root: data


tree = new Ext.tree.TreePanel
store: store
hideHeaders: true
headers: [
xtype: 'treeheader'
text: 'Name'
flex: 1
dataIndex: name
]

kyr0
17 Mar 2011, 2:47 PM
yep, that's because the callback function is not applied to the getSubStore() method when called on instances of Ext.data.RecordNode... will debug that tomorrow, since I need that to be working.

yrashk
18 Mar 2011, 5:52 AM
Can confirm it, too the same callback issue

yrashk
18 Mar 2011, 6:30 AM
Just in case, there's a very quick-n-dirty workaround that seemingly helps getting around this bug for the time being (until Sencha will fix it). I am sure it's a completely wrong way to do it (I have little to no ExtJS 4.0 internals knowledge), but it helps fixing the problem so I could continue developing:



diff --git a/priv/extjs/src/tree/TreePanel.js b/priv/extjs/src/tree/TreePanel.js
index ea383e8..069c3dd 100644
--- a/priv/extjs/src/tree/TreePanel.js
+++ b/priv/extjs/src/tree/TreePanel.js
@@ -68,6 +68,7 @@ Ext.define('Ext.tree.TreePanel', {

getViewStore: function(node) {
var store = this.store;
- return store.getSubStore(node ? node : store.getRootNode());
+ var that = this;
+ return store.getSubStore(node ? node : store.getRootNode(), function(a) { that.onStoreLoad(a);});
}
});

TommyMaintz
18 Mar 2011, 11:38 PM
Can you try this with the PR5 release? The PR4 release contained old Tree code, between 4 and 5 it has been completely refactored. Please let us know of the problem still exists.

yrashk
18 Mar 2011, 11:40 PM
Sorry, forgot to update PR5 is totally fine, have been happily running it with the Tree for a couple of hours at least :)

TommyMaintz
18 Mar 2011, 11:56 PM
Thats great to hear. Let us know if any of you run into weird issues with the Tree. The refactor has been significantly though, and we expect the Tree to be much more stable now.

4CastRisk
19 Mar 2011, 2:05 AM
+1 Tree seems to be fixed now, although I noticed this bug:



data =
text: '.'
children: [
_id: 'khjkkjjknkjjnkjk'
name: 'Organisation'
type: 'organisation'
children: [
_id: 'oidjfiogjwiogjeoi'
name: 'Office 1'
type: 'office'
children: [
_id: 'kjefklwflkwefjwelf'
name: 'Department 1'
type: 'department'
children: [
_id: 'jg394jg3gj34og34'
name: 'Role 1'
type: 'role'
leaf: yes
,
_id: 'fnsadjfsadkfbsadfs'
name: 'Role 2'
type: 'role'
leaf: yes
]
]
,
_id: 'kdnflkwnfg3434g34'
name: 'Office 2'
type: 'office'
children: [
_id: 'nvmwrvno3kjnvo34in3o4'
name: 'Role 3'
type: 'role'
]
]
]

Ext.regModel 'OrganisationItems',
idProperty: '_id'
fields: [
{ name: '_id', type: 'string' }
{ name: 'name', type: 'string' }
]


store = new Ext.data.TreeStore
model: 'OrganisationItems'
root: data

tree = new Ext.tree.TreePanel
store: store
useArrows: true
rootVisible: false

headers: [
xtype: 'treeheader'
text: 'Name'
flex: 1
dataIndex: 'name'
,
xtype: 'treeheader'
text: 'Type'
flex: 1
dataIndex: 'type'
]



Renders like this

http://dl.dropbox.com/u/147175/weird-tree-bug.png

TommyMaintz
19 Mar 2011, 2:16 AM
Can you try adding the 'type' field in your model definition. That will probably fix most of it.

Looking at your code example I do think there might be another bug as in some places we have used record.get('id') to get the record id. I'll make sure we change that to respect the idProperty config. For now try avoiding _id as the idProperty if you experience any other weird issues.

4CastRisk
19 Mar 2011, 2:23 AM
Hi Tommy,

Ok added the type field - still renders the same, the only difference is the name renders now rather than undefined.

The ID thing is not optional. I'm using CouchDB, which has a built in _id property, and that can't be changed. I know this is a hardcoded example, but I also have live data in the database we want to use.

In the meantime, I'll just have the one header which seems to work fine, and add other headers later.

TommyMaintz
19 Mar 2011, 2:33 AM
Oh wait, I only now see this in your code. treeheader is the xtype for the class that adds all the expanders and icons to the column. You only have to set the treeheader xtype for one column per Tree. Don't use an xtype on the other columns. Of course you could use any of the column types that are available for Grid.

We will make sure to have proper documentation and implement the remaining missing features asap. Also, you can look at the treegrid example inside the examples/tree folder for an example usage of a templateheader.

4CastRisk
19 Mar 2011, 2:41 AM
Ahh, that makes sense, thanks for the update and good work on getting this fixed! Keep up the work guys

yrashk
20 Mar 2011, 4:40 AM
[PR5] Looks like using TreePanel in scenarios beyond using standard Store and Proxies is next to impossible. I am trying to use a TreePanel subclass with an instance of TreeStore and I can't get this to work. I had to reset this.store in my subclass' initComponent after callParent(arguments) so that I can even access things like store.getRootNode() but even though I can add nodes dynamically, I am still not able to make ExtJS display them.

TommyMaintz
20 Mar 2011, 9:57 AM
@yrashk Could you be more specific about what you are trying to do in your sub class? TreePanel and TreeView should be pretty extendible.

If you post the code of your TreePanel subclass I can see if there is things we need to change.

yrashk
21 Mar 2011, 4:21 AM
While I am trying to extract an *isolated* minimal test case, I have a question: what's currently a *right* way to do getRootNode()? The one in TreeNode is empty ({}) and refers to the fact that you should use store.getRootNode(), but even though my store has getRootNode defined before initializing a TreePanel with it, after TreePanel is initialized, it's a different object that doesn't have a getRootNode property. I am intensely confused :)