title: ExtJS pass variable from controller to view
body: <p>I have a base controller that has a user object that is bind with the user data after login success. At this point the view that I need to pass the user object is already instantiated. Here is my base controller:</p>
  
  <pre><code>Ext.define('App.abstract.app.Controller', {
          extend: 'Ext.app.Controller',
  
          user: {} // user object that can be accessed by any controller
  
      });
  </code></pre>
  
  <p>Now, here is my <strong>Main.js</strong> controller that extends from my base controller and that implements the login function:</p>
  
  <pre><code>Ext.define('App.controller.Main', {
      extend: 'App.abstract.app.Controller',
  
      refs: [{
          ref: 'main',
          selector: 'app-main'
      },
      {
          ref: 'header',
          selector: 'appheader'
      }],
  
      init: function (application) {
          this.control({
              "loginform": {
                  loguser: this.onLoginUser
              },
              'app-main #logoutBtn': {
                  //click: this.onLogoutUser
              }
          });
      },
      onLoginUser: function (form, values) {
          var me = this;
          values.password = App.util.MD5.encode(values.password);
          App.util.Ajax.request({
              url: '/api/Security/ValidateUser',
              jsonData: values,
              success: function (response, opts) {
                  var obj = Ext.decode(response.responseText);
                  if (obj.success) {
  
                      // sets the base controller user object so it can be available in all app
                      Ext.apply(me.user, obj.data);
  
                      me.getMain().layout.setActiveItem(1);
  
                      // HERE I WANT TO PASS MY me.user TO MY MAIN.js VIEW 
  
                  }
              }
          });
      },
  
      }
  });
  </code></pre>
  
  <p>Here is my <strong>Main.js</strong> view where I need to get the user object to I can set the User name in my footer (south panel).</p>
  
  <pre><code>Ext.define('App.view.Main', {
      extend: 'Ext.container.Container',
  
      requires: [
          'Ext.layout.container.Card',
          'Ext.layout.container.Border',
          'Ext.layout.container.Accordion',
          'Ext.form.Label',
          'App.view.login.LoginForm',
          'App.view.Dashboard',
          'App.view.MainPanel',
          'App.view.Header',
          'App.view.menu.Accordion'
      ],
  
  
      xtype: 'app-main',
      layout: {
          type: 'card'
      },
      items: [{
          xtype: 'container',
          layout: {
              type: 'hbox',
              align: 'stretch'
          },
          defaults: { flex: 1 },
          items: [{
              xtype: 'component'
          }, {
              xtype: 'container',
              layout: {
                  type: 'vbox',
                  align: 'stretch',
              },
              defaults: { flex: 1 },
              items: [{ xtype: 'component' }, { xtype: 'loginform' }, { xtype: 'component' }]
          }, {
              xtype: 'component'
          }]
      },
      {
          xtype: 'panel',
          layout: {
              type: 'border'
          },
          items: [
         {
             xtype: 'mainmenu',
             width: 250,
             region: 'west'
         },
         {
             xtype: 'appheader',
             region: 'north'
         },
         {
             xtype: 'mainpanel',
             region: 'center'
         },
         {
             xtype: 'container',
             region: 'south',
             items:
                 [
                      {
                          xtype: 'toolbar',
                          margin: '0',
                          style: 'background-color:#3892D3;',
                          items: [
                              {
                                  xtype: 'displayfield',
                                  id: 'username',
                                  fieldLabel: 'User Name',
                                  width: 100,
                                  labelWidth: 70,
                                  style: 'color:#FFFFFF;',
                                  value: '&lt;span style="color:#FFFFFF;font-size:12px"&gt;HERE I NEED THE USER NAME&lt;/span&gt;'
                              }
                          ]
                      }
                 ]
         }
          ]
      }
      ]
  });
  </code></pre>
  
  <p>Any clue?</p>