second level treeNode is undefined

[runfaj]

Hi,

I've got a tree panel that has a structure like so:



root (hidden)
building

zone

zone 1
zone 2
zone #...


sweeper

area 1
area 2
area #...


building

same stuff


building

same stuff



Each time an expand button is pressed, it loads dynamically. The first level (building) expands fine providing the zone and sweeper. But when I try to expand the second level (zone or sweeper), I get the following error:




"record.isNode is undefined"

decorate: function(record) {
if (!record.isNode) { -- line 78205 ext-all-dev.js



Here's the json that is returned to the treestore for the third level:




{"success":true,"total":2,"payload":[{"id":"zone_1","item_id":1,"text":"zone 1","leaf":true,"expandable":false},{"id":"zone_1","item_id":2,"text":"zone 2","leaf":true,"expandable":false}]}


And here is the previous json that did load correctly under the first level:




{"success":true,"total":2,"payload":[{"id":"area_type_1","item_id":1,"building_id":57,"text":"Zone","leaf":false,"expandable":true},{"id":"area_type_2","item_id":2,"building_id":57,"text":"Sweeper","leaf":false,"expandable":true}]}


The extended model is pretty standard, just fields and an ajax proxy. The extended store is also standard with just the model and root defined.

Can someone point me on what to attempt to fix this? I can provide other code as needed.

[vietits]

I have tried to simulate your tree with the following code. However, this code works well for me. I'm using Ext 4.0.7, Chrome 18


Ext.onReady(function() {
Ext.define('Node', {
extend: 'Ext.data.Model',
fields: [
{name: 'id', type: 'string'},
{name: 'item_id', type: 'string'},
{name: 'text', type: 'string'},
{name: 'leaf', type: 'boolean'},
{name: 'expandable', type: 'boolean'}
]
});


var store = Ext.create('Ext.data.TreeStore', {
model: 'Node',
proxy: {
type: 'ajax',
url: 'treegrid1.cgi/read',
reader: {
type: 'json',
root: 'payload'
}
},
autoLoad: true,
root: {
expanded: true
}
});


var tree = Ext.create('Ext.tree.Panel', {
width: 500,
height: 300,
renderTo: Ext.getBody(),
rootVisible: false,
store: store,
columns: [{
xtype: 'treecolumn',
text: 'Text',
flex: 1,
dataIndex: 'text'
}]
});
});

Root node payload


{"success":true,"payload":[{"text":"buiding 1","id":"building_1","expandable":true,"leaf":false,"item_id":1},{"text":"buiding 2","id":"building_2","expandable":true,"leaf":false,"item_id":2}],"total":2}

building_1 node payload


{"success":true,"payload":[{"text":"Zone","id":"area_type_1","expandable":true,"leaf":false,"item_id":1},{"text":"Sweeper","id":"area_type_2","expandable":true,"leaf":false,"item_id":2}],"total":2}

area_type_1 node payload


{"success":true,"payload":[{"text":"Zone 1","id":"zone_1","expandable":false,"leaf":true,"item_id":1},{"text":"Zone 2","id":"zone_2","expandable":false,"leaf":true,"item_id":2}],"total":2}

[runfaj]

figured it out. your example worked because you gave the json manually and the ids were different. for some reason my backend was sending different objects with duplicate ids. i fixed that and it all worked.