title: Sencha touch2: How can i parse my nested json data?
body: <p>i could not able to parse my nested json data and i tried in many ways but i could not succeed. any help is appreciated.
  Here is my json output looks like:</p>
  
  <pre><code>[
    {
      "task": {
        "locator": "FGWESD",
        "subtask": [
          {
            "work": {
              "number": "1145",
              "id": "0",
              "status": true,
              "gate": "N\/A",
              },
            "sequenceNumber": "0",
            "id": "0"
          },
          {
            "work": {
              "number": "1145",
              "id": "0",
              "status": true,
              "gate": "N\/A",
            },
            "sequenceNumber": "0",
            "id": "0"
          }
        ],
        "connectTime": "0",
        "id": "0"
      }
    }
  ]
  </code></pre>
  
  <p>Here is my model:</p>
  
  <pre><code>Ext.define('MyApp.model.MyModel',{
      extend:'Ext.data.Model',
      xtype:'myModel',
      config:{
          fields:[
          {name:'number',mapping:'work.number'},
          {name:'id',mapping:'work.id'},
          {name:'locator',mapping:'task.locator'},
          {name:'gate',mapping:'work.gate'}
  
          ]
      }
  });
  </code></pre>
  
  <p>Here is the store:</p>
  
  <pre><code>Ext.define('MyApp.store.StoreList', {
      extend:'Ext.data.Store',
       config:{
          model:'MyApp.model.MyModel',
          storeId: 'id_Store',
  // added the url dynamically inside the controller
          proxy:{
              type:'ajax',
              reader:
              {
                  type:"json",
                  rootProperty: 'subtask'
              },
              method: 'POST',
              actionMethods: {
                  create : 'POST',
                  read   : 'POST', // by default GET
                  update : 'POST',
                  destroy: 'POST'
              },
              headers :{
                  "Content-Type" :'application/xml',
                  'Accept':'application/json'
              }
  
          }
      }
  });
  </code></pre>
  
  <p>Here is my controller code :</p>
  
  <pre><code>    Ext.define('MyApp.controller.LoginController', {
          extend: 'Ext.app.Controller',
          requires: ['Ext.data.proxy.Rest'],
  
          config: {
  // My code is too long to add here so am adding store loading when user taps login button
  
  },
    getDetails: function(){
          var segmentStore = Ext.create('MyApp.store.StoreList');
          var url = 'http://localhost:8080/apps';
          segmentStore.getProxy().setUrl(url.trim());
          segmentStore.load({
                     scope:this,
                      callback: function(records, operation, success){
                          if(success){
                             console.log('records: ',records);
  
                             console.log('records: '+records.length); // prints here 1
                            console.log('locator: '+records[0].getData().locator);
  // prints FGWESD
                            console.log('locator: '+records[0].getData().number);
  //prints undefined
  // 
                          }
  }
              }
          )
      },
  });
  </code></pre>
  
  <p>Can any one please help me out. how can i get Values of number, gate, id and status?
  What are the necessary changes have to be made in model, store and controller ?
  Please help me out in resolving ? Thanks.</p>