title: ExtJS 4: Where should view events live if not using ExtJS MVC architecture?
body: <p>When using the Sencha ExtJS framework, the events for your view live inside of the controller for that view.  If you're not using a controller, where do you store the events.  </p>
  
  <p>For example, suppose our MVC application, we have a grid of users (userlist), and we have an event "itemdblclick".  How would we implement "itemdblclick" inside of our non-MVC application?</p>
  
  <pre><code>Ext.define('AM.view.user.List' ,{
      extend: 'Ext.grid.Panel',
      alias: 'widget.userlist',
      title: 'All Users',
  
      // we no longer define the Users store in the `initComponent` method
      store: 'Users',
  
  ...
  
  });
  
  
  
  Ext.define('AM.controller.Users', {
      extend: 'Ext.app.Controller',
      stores: ['Users'],
      models: ['User'],
  
      views: [
          'user.List',
          'user.Edit'
      ],
  
      init: function() {
          this.control({
              'viewport &gt; userlist': {
                  itemdblclick: this.editUser
              },
              'useredit button[action=save]': {
                  click: this.updateUser
              }
          });
      },
  
      editUser: function(grid, record) {
          var view = Ext.widget('useredit');
          view.down('form').loadRecord(record);
      },
  
      updateUser: function(button) {
          console.log('clicked the Save button');
  
          var win = 
              button.up('window'),
              form = win.down('form'),
              record = form.getRecord(),
              values = form.getValues();
  
          record.set(values);
          win.close();
  
          // synchronize the store after editing the record
          this.getUsersStore().sync();
      }
  
  });
  </code></pre>