Multi level rowexpnader grid

I am creating a grid which sholud be multilevel. So When I am using static I am able to get that, here is the code which is working in fiddler.

Ext.create('Ext.data.Store', {
    storeId:'nestedStore1',
    fields:['productid', 'productName', 'qty'],
    data:{'items':[
        { 'productid': 'pr-1',  "productName":"Orange",  "qty":"5"  },
        { 'productid': 'pr-2',  "productName":"Apple",  "qty":"6" },
        { 'productid': 'pr-3', "productName":"papaya",  "qty":"3"  },
        { 'productid': 'pr-4', "productName":"Mango", "qty":"9"  }
    ]},
    proxy: {
        type: 'memory',
        reader: {
            type: 'json',
            rootProperty: 'items'
        }
    }
});

Ext.create('Ext.data.Store', {
    storeId:'orderstore',
    fields:['orderid', 'amt', 'date'],
    data:{'items':[
        { 'orderid': 'O12',  "amt":"1000",  "date":"29/05/2015"  },
        { 'orderid': 'O121',  "amt":"1200",  "date":"29/05/2015" },
        { 'orderid': 'O122', "amt":"1100",  "date":"29/05/2015"  },
        { 'orderid': 'O123', "amt":"900", "date":"29/05/2015"  }
    ]},
    proxy: {
        type: 'memory',
        reader: {
            type: 'json',
            rootProperty: 'items'
        }
    }
});

Ext.define('EkaTRM.view.base.grid.ContractPanelGrid',{
    extend:'Ext.grid.Panel',
    alias:'widget.contractpanelgrid',
    requires:['Ext.grid.Panel','EkaTRM.view.base.grid.RowExpanderGrid'],
    title: 'Contract Application',
    autoHeight: true,
    store: Ext.data.StoreManager.lookup('orderstore'),
    columns: [
        { text: 'Order Id',  dataIndex: 'orderid' },
        { text: 'Amount', dataIndex: 'amt', flex: 1 },
        { text: 'Date', dataIndex: 'date' }
    ],
    plugins:[{
        ptype: 'rowexpandergrid',
        gridConfig: [{
            store: 'nestedStore1',
            columns: [
                { text: "Product ID", dataIndex: 'productid' ,menuDisabled : false,resizable:true,editor:'textfield'},
                { text: "Product Name", dataIndex: 'productName' ,menuDisabled : true,resizable:false,editor:'textfield'},
                { text: "Qty", dataIndex: 'qty' ,menuDisabled : true,resizable:false,editor:'numberfield'}
            ],
            columnLines: false,
            border: true,
            autoWidth: true,
            autoHeight: true,
            frame: false,
            header: false,
            plugins:[{
                ptype: 'rowexpandergrid',
                gridConfig: [{
                    store: 'nestedStore1',
                    columns: [
                        { text: "Product ID", dataIndex: 'productid' ,menuDisabled : false,resizable:true,editor:'textfield'},
                        { text: "Product Name", dataIndex: 'productName' ,menuDisabled : true,resizable:false,editor:'textfield'},
                        { text: "Qty", dataIndex: 'qty' ,menuDisabled : true,resizable:false,editor:'numberfield'}
                    ],
                    columnLines: false,
                    border: true,
                    autoWidth: true,
                    autoHeight: true,
                    frame: false,
                    header: false
                }]
            }]
        }]
    }]

});

Now I want to make it dynamic. SO what i am doing is i am adding

plugins  : [{
        ptype  : 'rowexpandergrid',
        gridConfig: [{
            columns:[]
        }]
    }], 

in my grid and on expand I am adding the another grid. here is the code of expand.

init:function(nestedGrid){
        var me = this;
        this.callParent(arguments);
        nestedGrid.getView().on('expandbody',me.addInnerGridOnExpand,me);
    },

 addInnerGridOnExpand : function (rowNode, record, expandRow, eOpts) {
        var me=this;
        if( Ext.fly(rowNode).down('.x-grid-view')){
            return;
        }
        var parentGrid = this.getCmp();
        me.recordsExpanded[record.internalId] = false;
        var detailData = Ext.DomQuery.select("div.detailData", expandRow);
        var innerGrid=Ext.create('Ext.grid.Panel',
            me.gridConfig[0],
         );

         innerGrid.setColumns(parentGrid.Column);
        innerGrid.getStore().loadData(SalesStore);
        innerGrid.render(detailData[0]);
    },

Now this is working fine for one level. Now I want the second grid should be expandable as well. I stuck over here, Any help how to make multilevel grid by row expanding in extJS.

Here is what i am trying do is adding one more grid inside inner but no getting that.

from Multi level rowexpnader grid