Extjs 4.1.3 Nested Grid using rowexpander plugin not working - extjs4.1

Question

Im trying to use the example from sencha and configure rowexpander. When the grid renders the expander is already opened for each row and with nothing inside. When i click on its icon the following error is generated:
Uncaught TypeError: Cannot call method 'addCls' of null
Have anyone else faced this issue ? Can someone post an example of hpw to use rowexpander please.
plugins : [{
ptype : 'rowexpander',
rowBodyTpl : ['<div id="NestedGridRow-{rowId}"></div>'],
pluginId : 'rowexpanderplugin',
selectRowOnExpand : true,
// this gives each row a unique identifier based on record's "acct_no"
rowBodyTpl : ['<div id="NestedGrid-{name}" ></div>'],
// stick a grid into the rowexpander div whenever it is toggled open
toggleRow : function(rowIdx) {
var rowNode = this.view.getNode(rowIdx), row = Ext.get(rowNode), nextBd = Ext.get(row).down(this.rowBodyTrSelector), hiddenCls = this.rowBodyHiddenCls, record = this.view.getRecord(rowNode), grid = this.getCmp(), name= record.get('name'), targetId = 'NestedGrid-' + name;
if (row.hasCls(this.rowCollapsedCls)) {
row.removeCls(this.rowCollapsedCls);
this.recordsExpanded[record.internalId] = true;
this.view.fireEvent('expandbody', rowNode, record, nextBd.dom);
if (rowNode.grid) {
nextBd.removeCls(hiddenCls);
rowNode.grid.doComponentLayout();
rowNode.grid.view.refresh();
} else {
// this is the store for the inner grid
Ext.create('innsergridstore', {
autoLoad : {
callback : function() {
// create the inner grid and render it to the row
nextBd.removeCls(hiddenCls);
var grid = Ext.create('NestedGrid', {// <-- this is my "inner" grid view
renderTo : targetId,
store : this,
row : row
});
rowNode.grid = grid;
grid.suspendEvents();
}
}
});
}
} else {
row.addCls(this.rowCollapsedCls);
nextBd.addCls(this.rowBodyHiddenCls);
this.recordsExpanded[record.internalId] = false;
this.view.fireEvent('collapsebody', rowNode, record, nextBd.dom);
}
}
}]