title: Sencha Touch 2.0 and navigation.View - MVC
body: <p>I would like to switch views with a button, there is absolutely no examples of it in a MVC context in the sencha documentation although they recommend developers to use their build in MVC architecture. I guess its because Touch 2.0 is rather new.</p>
  
  <p><a href="http://docs.sencha.com/touch/2-0/#!/api" rel="nofollow noreferrer">http://docs.sencha.com/touch/2-0/#!/api</a></p>
  
  <p>The video about the list component is also about navigation.View, but since the list component is used, they dont show how to switch views with a button.</p>
  
  <p>Video: <a href="http://docs.sencha.com/touch/2-0/#!/video/list" rel="nofollow noreferrer">Intro to List Component</a></p>
  
  <p>This is the code i have so far:</p>
  
  <p>uddannelser.js (First view)</p>
  
  <pre><code>Ext.define("VUCFyn.view.uddannelser", {
  extend: "Ext.navigation.View",
  xtype: "uddannelser",
  requires: [
      "VUCFyn.view.avu"
  ],
  
  config: {
      title: "Uddannelser",
      cls: "uddannelser",
      items: [
          {
              title: "Uddannelser",
              xtype: "container",
              margin: 20,
              layout: "vbox",
              items: [
                  {
                      xtype: "button",
                      text: "AVU",
                      width: 100
                  }
              ]
          }
      ]
  }});
  </code></pre>
  
  <p>avu.js (subview of uddannelser)</p>
  
  <pre><code>Ext.define("VUCFyn.view.avu", {
  extend: "Ext.Panel",
  xtype: "avu",
  
  config: {
      title: "AVU",
      cls: "avu",
      scrollable: true,
      items: [
          {
              xtype: "label",
              html: [
                  "&lt;p&gt;Almen Voksenuddannelse - avu - er et tilbud om uddannelse til alle over 18 år. Du kan tage avu-fagene et ad gangen eller i en kombination med flere fag. Du kan også kombinere avu-fagene med andre enkeltfag på FVU og/eller hf.&lt;/p&gt;",
                  "&lt;h5&gt;AVU omfatter kernefagene:&lt;/h5&gt;",
              ].join("")
          }
      ]
  }});
  </code></pre>
  
  <p>Main.js (controller)</p>
  
  <pre><code>Ext.define('VUCFyn.controller.Main', {
  extend: 'Ext.app.Controller',
  
  config: {
      refs: {
          uddannelser: "uddannelser"
      },
      control: {
          "uddannelser": {
              tap: "showDetail"
          }
      }
  },
  
  showDetail: function () {
      this.getUddannelser().push({
          xtype: "avu"
      });
  },
  
  init: function () {
  
  }});
  </code></pre>
  
  <p>Please, if someone could show me how to do it, based on the above code (or similar) that would be great.</p>
  
  <p>btw: the answers in this thread: <a href="https://stackoverflow.com/questions/7883097/sencha-touch-2-mvc-how-to-switch-views-with-button">Sencha Touch 2 MVC - how to switch views with button</a> is not working for me. (No errors though) I think its for Sencha Touch 1.1, and a lot of things have apparently changed in 2.0</p>