title: ExtJs Data Store values empty but Store Raw value populated
body: <p>So I'm having trouble trying to determine why my store's data values aren't populating for my itemselector component, but the raw data values are populated, it looks like my model and stores are setup correctly. I'm trying to just utilize that first particular portion of the json data so that's why I have the rootProperty set to  'data[0].options'. Just trying to populate that itemselector with that 'Area' collection of json data. Components are below, any help would be appreciated.</p>
  
  <p>ItemSelector</p>
  
  <pre><code>xtype: 'itemselector',
                          cls: 'itemSelectorPlainPanel',
                          margin: '10 10 10 10',
                          labelAlign: 'top',
                          height: 200,
                          flex: 1,
                          autoScroll: true,
                          id: 'ertcSelector',
                          buttons: ['add', 'remove'],
                          reference: 'ertcSelector',
                          store: Ext.create('cers.store.ManagerFilterStore'),
                          displayField: 'label',
                          allowBlank: true,
                          msgTarget: 'side',
                          fromTitle: 'Available ERTC Home Area',
                          toTitle: 'Selected ERTC Home Area',
                          listeners: {
                           render: function() {
                               console.log(this);
                               /*console.log('Value is ' + this.fromField.store.data.items.length);*/
                              }
                           }
  </code></pre>
  
  <p>Store</p>
  
  <pre><code>Ext.define('cers.store.ManagerFilterStore', {
      extend: 'cers.util.Store',
      requires:[
          'cers.model.ManagerFilterItems',
          'cers.util.MsgHelper',
          'Ext.data.proxy.Rest'
      ],
      model: 'cers.model.ManagerFilterItems',
      storeId: 'managerFilterId',
      autoLoad: true,
      proxy: {
          type: 'rest',
          method: 'GET',
          url: '/rest/mgrqueue/init',
          extraParams: {
              authUserId: 'eksioog'
          },
          reader: {
              type: 'json',
              rootProperty: 'data[0].options',
              totalProperty: 'total',
              successProperty: 'success',
              messageProperty: 'message'
          }
      },
      listeners: {
          datachanged: function() {
              /*console.log('rawData below!!!!');
              console.log(this.getProxy());
              console.log('Model Info');
              console.log(this.getProxy().getModel().getFields());
              console.log('getData');
              console.log(this.getData());
              console.log('Fields');
              console.log(this.getProxy().getModel().getFields());
              console.log('Model');
              console.log(this.getProxy().getModel());
              console.log('Store');
              console.log(this);
              console.log('Data');
              console.log(this.getData());*/
              console.log('Reader');
              console.log(this.getProxy().getReader());
          }
      },
  
      constructor: function(){
          this.callParent(arguments);
          /*this.filter('model', 'Area');*/
      }
  });
  </code></pre>
  
  <p>Model</p>
  
  <pre><code>Ext.define('cers.model.ManagerFilterItems', {
      extend: 'cers.util.Model',
  
      constructor: function (args) {
          this.callParent(args); // Calls the parent constructor of parent class being extended
      },
      fields: [
          { name: 'label', type: 'string'},
          { name: 'value', type: 'string'},
          { name: 'active', type: 'boolean'},
          { name: 'selected', type: 'boolean'}
      ],
      idProperty: 'label',
  
      getLabel : function() {
          return this.get('label');
      },
  
      setLabel : function(value) {
          this.set('label', value);
      },
  
      getValue : function() {
          return this.get('value');
      },
  
      setValue : function(value) {
          this.set('value', value);
      },
  
      getActive : function() {
          return this.get('active');
      },
  
      setActive : function(value) {
          this.set('active', value);
      },
  
      getSelected : function() {
          return this.get('selected');
      },
  
      setSelected : function(value) {
          this.set('selected', value);
      }
  });
  </code></pre>
  
  <p>Json Data</p>
  
  <pre><code>{
    "data" : [ {
      "model" : "Area",
      "functionality" : "ManagerQueueFilter",
      "options" : [ {
        "label" : "HeadQuarters",
        "value" : "12",
        "active" : true,
        "selected" : false
      }, {
        "label" : "Northeast",
        "value" : "2",
        "active" : true,
        "selected" : false
      }, {
        "label" : "Testing Area",
        "value" : "41",
        "active" : true,
        "selected" : false
      } ], }
  {
      "model" : "User",
      "functionality" : "ManagerQueueFilter",
      "options" : [
  {
        "label" : "Green, Ted",
        "value" : "c0gret6_vzwm",
        "active" : false,
        "selected" : false
      }, {
        "label" : "Eksioglu, Oguz",
        "value" : "eksioog",
        "active" : true,
        "selected" : true
      } ]
    } ],
    "total" : 2,
    "success" : true,
    "message" : "Success"
  </code></pre>