Grouping/expanding ExtJS Grid with subrows

Question

So here's the case that I'm working on: I have an ExtJS grid of data items that should have collapsible rows of sub-items. That is, most of the data on the grid need not be visible to begin with, but there should be the ability to expand the sub-rows of a "master row" by clicking on some kind of a [+]-icon.

GroupingView doesn't seem to do, as the group row is not a normal data row on the grid. RowExpander is more like it when it comes to having the "grouping rows" as normal rows, but then, I'm not sure how to approach actually having sub-rows in the expanded part of the grid.

I found this so far and it seems like it might have something to do with what I'm after...

http://www.sencha.com/forum/showthread.php?53289-EXTJS-RowExpander

Any pointers of the most reasonable way to approach this, hopefully with ExtJS 2.0.2?

Answer 1

Have a look at the answer I posted to this question

Answer 2

I am not sure if this will work with ExtJS 2.x since I have moved on to 3.x long ago.

(and will strongly suggest anyone who is going anything remotely serious with ExtJS to always upgrade to latest version in a reasonable time frame.
The library is still comparatively new in the sense that the major version releases have too many positive changes and improvements to ignore upgrading)

That said, what you are looking for is indeed Ext.ux.grid.RowExpander
Here is how you approach it -
Example (first example on that page)
Code