title: EXTjs access data set in one controller from another
body: <p>I have a view that has some child views (all of them extend Ext.grid.Panel). The controller of the parent view sets a variable that I want to access in the controller in the child view. I tried setting a variable in the init function of the parent controller. Then I tried reading its value in a click function of the child page's controller. But then that threw an uncaught ReferenceError. </p>
  
  <p>How do I do this?</p>
  
  <p>Ive tried something like this on <a href="https://fiddle.sencha.com/#home" rel="nofollow">Sencha fiddle</a>. I am trying to get the <code>alert(MyApp.app.getController('MyApp.controller.Whatever').myVar);</code> to work</p>
  
  <pre><code>//CHILD
  
  //Controller
  Ext.define('MyApp.controller.child', {
      extend: 'Ext.app.ViewController',
      alias: 'controller.child',
      init: function() {
          alert("Initializing Child");
      }
  });
  
  
  
  //View
  Ext.define('MyApp.view.child', {
      extend: 'Ext.form.field.Text',
      alias:'widget.child',
      controller: 'child',
      title: 'Alien',
      width: 200, 
       listeners: {
                      focus: function(comp){
  
                          alert(MyApp.app.getController('MyApp.controller.Whatever').myVar);
                      }
                  },
      renderTo: Ext.getBody()
  
  
  });
  
  //----------
  
  //PARENT 
  
  //Controller
  Ext.define('MyApp.controller.Whatever', {
      extend: 'Ext.app.ViewController',
      alias: 'controller.Whatever',
      myVar:0,
      init: function() {
          alert("initializing parent");
          myVar=20;
      }
  });
  
  
  
  //View
  Ext.define('MyApp.view.Whatever', {
      extend: 'Ext.form.Panel',
      alias:'widget.Whatever',
      controller: 'Whatever',
      title: 'Hello',
       items:[{
                  xtype: 'child'
  
              }],
  
      width: 200,
  
      renderTo: Ext.getBody()
  
  });
  
  //------------------------
  
  
  Ext.application({
      name: 'MyApp',
  
  
      launch: function() {
  
          Ext.create('MyApp.view.Whatever');
  
      }
  });
  </code></pre>