title: Load treegrid data dyanamically from a json property file in extjs
body: <p>Treegrid is not getting rendered properly. Here is the code:</p>
  
  <p><strong>treeGrid.js :</strong></p>
  
  <pre><code>Ext.define('App.view.DBStatusGrid', {
  extend      : 'Ext.container.Container',
  xtype       : 'app-DB-grid',
  layout      : 'vbox',
  items       : [
      {
          xtype   : 'container',
          cls     : 'boxTitle',
          html    : 'DB Details'
      },
      {
       xtype : 'treepanel',
       singleExpand: true,
       useArrows:true,
       rootVisible:false,
       columns: [
                 {text: 'Server Status',  dataIndex: 'serverStatus' , width: 80,},
                 { xtype: 'treecolumn',text: 'Server Name',  dataIndex: 'serverName' , width: 140},
                 { text: 'Instance Status', align:'center', dataIndex: 'instanceStatus',width: 80,},
                 {text: 'Instance Name', align:'center', dataIndex: 'instanceName',width: 140}
        ]
      }
    ]
  });
  </code></pre>
  
  <p><strong>property.json :</strong> </p>
  
  <pre><code> "data":[ 
           {
            "serverStatus": "active",
            "serverName":"rg0C1",
            "iconCls":"task-folder",
            "expanded":false,
            "data": [
                          {
                           "instanceStatus": "active",
                           "instanceName":"OA1",
                           "leaf":true,
                           "iconCls":"no-icon"
                           }
                         ]
           }
        ]
  </code></pre>
  
  <p><strong>Creating store</strong></p>
  
  <pre><code>Ext.define('App.view.InnerContainerView', {
  extend      : 'Ext.container.Container',
  xtype       : 'app-inner-ContainerView',
  config  : {
      component   : 'NONE',
      parentView  : ''
  },
  initComponent   : function() {
      var parentView = this.getParentView();
      this.items = [
          {
            xtype : 'container',
            layout: 'card',
            items : [
                     {
                        xtype: 'app-DB-grid',
                        parentView: parentView,
                        listeners :{
                        render : function(){
                        var store = Ext.create('Ext.data.TreeStore',
                        {
                          model: 'App.model.treeModel',
                          autoLoad: true,
                          proxy: {
                                   type: 'ajax',
                                   url:'app/data/property.json',
                                   reader: {
                                         type: 'json',
                                         root : 'data'
                                     }
                            }, 
                            root :{
                                expanded :true
                            }
                          });
                           this.down('treepanel').setRootNode(store.getRootNode()); // I am getting my treegrid,and setting the rootnode.
                    }
                   ]
         }
        ]
      this.callParent();
     });
  </code></pre>
  
  <p><strong>My Problem :</strong></p>
  
  <p>From the json property file,only serverName is getting displayed in the treegrid.When I try to expand the serverName,it is not getting expanded.Please help me resolve this issue.Please point me to the correct direction if I am going wrong somewhere.Any help would be appreciated.Thanks.</p>