title: Extjs4: How to share data between multiple stores or models?
body: <p>I'm new to Ext and I'm struggling to figure out Models Stores and Proxies. </p>
  
  <p>The server returns one large JSON object. 
  For example.</p>
  
  <pre><code>{ 
      "responseHeader":{ 
          "status":0, 
          "QTime":12, 
          "params":{ 
              "facet":"true", 
              "facet.limit":"40" 
          }
      },
      "response":{
          "numFound":3806,
          "start":0,
          "docs":[ 
              { 
                  //Lots of fields
                  "id":"1234",
                  ...
                  //Some array properties
                  "testfield":[ 
                      "",
                      ""
                  ],
                  ...
              }
          ]
      },
      "facet_counts":{
          "facet_queries":{
              "email":3806
          },
          "facet_fields":{
             "emailaddress":{ 
              },
              "subject":{
                  "candles":136,
                  "filter":130 
              },
              "fromemail":{ 
              },
             //...
          },
          "facet_dates":{ },
          "facet_ranges":{}
      },
      "highlighting":{
          "some doc id":{
              "emailtext":[ " Tel.: blah blah &lt;em&gt;blah&lt;/em&gt;" ],
              "combined":[ "&lt;em&gt;Email&lt;/em&gt; To: blah blah blah" ]
          }
      }
  }
  </code></pre>
  
  <p>I don't want to load this data more than once, I want to grab data from this object, for example the docs object, and put it into a grid. Then pull out another part to put into a selectbox. </p>
  
  <p>How do I load this data once, yet create models and stores to give to grids and selectboxes, from it?</p>
  
  <p>From what I read the proxy holds the servers response? So I tried creating a proxy out side of a store. Thinking I could use the same proxy with more than one store.</p>
  
  <pre><code>var myProxy1 = Ext.create('Ext.data.proxy.Proxy', {
      type: 'ajax',
      url : '../test',
      reader: {
          type: 'json',
          root: 'responseHeader'
      }
  });
  </code></pre>
  
  <p>But when I pass myProxy1 to a store</p>
  
  <pre><code>Ext.define('Test', {
      extend: 'Ext.data.Model',
      fields: [
          {name: 'status', type: 'int'},
          {name: 'QTime',  type: 'int'},
          {name: 'param',  type: 'auto'}
      ]
  });
  
  var myStore = Ext.create('Ext.data.Store', {
      model: 'Test',
      proxy: myProxy1,
      autoLoad: true,
      listeners:{
          load: function( ths, records, successful, operation, eOpts ){
              debugger;
          }
      }
  });
  </code></pre>
  
  <p>It doesn't work. The load event is never fired. No data is loaded. I can see that the proxy made the request, I see the response from the server, but it doesn't load.</p>
  
  <p>If I put the proxy inline it loads.</p>
  
  <pre><code>var myStore = Ext.create('Ext.data.Store', {
      model: 'Test',
      proxy:{
         type: 'ajax',
         url : '../test',
         reader: {
           type: 'json',
           root: 'responseHeader'
         }
      },
      autoLoad: true,
      listeners:{
          load:function( ths, records, successful, operation, eOpts ){
           debugger;
          }
      }
  });
  </code></pre>
  
  <p>I was thinking I could have one proxy, attach it to multiple stores, and just change the reader on it before I load the store.</p>