title: Reference all instances of ExtJS component on a page
body: <p>I have created several reusable ExtJS components, similar to the following:</p>
  
  <pre><code>MyCustomGridPanel = Ext.extend(Ext.form.GridPanel, {
      constructor: function(config) {
          config = Ext.apply({
              // some other default options
          }, config);
  
          MyCustomFormPanel.superclass.constructor.call(this, config);
      }
  });
  </code></pre>
  
  <p>I am then able to include this custom grid panel in pages where I need it. In some cases I will have this same grid panel on a page multiple times.</p>
  
  <p>The problem that I'm trying to solve is that I have form panels that I would like to automatically update any grid panel that contains data related to the form panel refreshed automatically.</p>
  
  <p>In the case of a single grid panel on the page, upon the successful submission of a form panel I am able to call <code>Ext.getCmp('the_id_of_the_grid_panel').getStore().reload()</code>. But with multiple instances of these grid panels, I'd like do something similar but without using an ID since an ID has to be unique. I'd like to get an array of all grid panels on the page with an identifier of some sort and call <code>&lt;item&gt;.getStore().reload()</code>.</p>
  
  <p>My Google search and Stack Overflow search abilities have failed me and I can't seem to find anything to get me what I'm looking for.</p>