Grid combining treepanel EXTJS

Question

I want to add a grid inside a treepanel, when a node have a depth of 2 and I expand it, I want to show a grid. This action works but when I select each row on that grid there is appear on error in the console

TypeError: o is undefine return o.id;

Does anybody know why this is happening? and what can I do in order to fix this?

In this fiddle https://fiddle.sencha.com/#fiddle/5o9 there is an example of the implementation.

The node that shows the grid is when the "lolaMonitors" node is expanded.

I have seen that this fail in the method

getKey : function(o){
         return o.id;
},

of the AbstractMixedCollection file, but I do not Know how to fix it.

Thank you very much in advance!.

Answer 1

It is because the events from the inner grid propagate to the tree (that is a sort of grid too) but the tree cannot identify what was clicked hence the error.

I don't think there's any easy way prevent this behavior without going deep into the grid code and override some chunks.

You might consider to re-design your UI so that it doesn't involve grid-in-grid, or grid-in-tree.