Rendering a new view when a button is clicked

I am a noob with Sencha 2 and I am trying to find a way to render a new view when a button is clicked. Specifically, I have this view called Home

Home

Ext.define("Blog.view.Home", {
  extend:'Ext.Panel',
  xtype:'homepanel',


  config:{
    iconCls:"home",
    title:"Home",
    items:[
      {
        defaults:{
          iconMask:true
        },
        xtype:'toolbar',
        title:'Recent Blogs',
        docked:'top',
        items:[
          {
            id:'newBlog',
            xtype:'button',
            iconCls:'add',
            handler:function () {
              //What do I do here?
            }
          }
        ]
      },

      {
        html:"Recent Blogs"
      }
    ]
  }
});

And I want that button, when clicked, to render a new view. I am just not sure how I would do such thing. Can someone give me some pointer? Is this the best way to do this? Should I move this to my controller? If yes, what event should I listen to?

Answers


The way I do it (i'm also learning) is defining the property 'action' of my button, for example:

{
  xtype: 'button'
  action: 'doSomething',
}

and handling the event in the control configuration of my controller:

control: {
  'button[action=doSomething]' : {
     tap: function() {
       getMainView().push(...);
     }
 }

in the handler you can push a new view if you are using the NavigationView or add a new view to the ViewPort directly.

Hope it helps.


Need Your Help

Executing Weka Classification in C# in Parallel

c# linq classification weka

I have asked a few broad questions about the operations of Weka and C# as well as WekaSharp, so I thought I would try to ask a more focused question to try to progress further on my own. As an exam...

How to extract data from one of the sheets in XLS file using POIFS API?

java apache-poi xls event-driven poi-hssf

I understand how to use POI API (User Model). However, presently, this is not helpful to me as I'm dealing with XLS files larger than 200 MB in size.