Basica view switching - how?

[Surykat]

Hi!

I'm new in MVC and I need some help in understand a logic of views and controllers. I have two questions.

1) Can I have multiple controllers? For example, every view has own controller which is dynamically initialized when I switch view?

2) What I am doing wrong with building a simple MVC app, when I setActiveItem to my second View when I click a button. And I want to go back to first view with another button. Everythings goes without errors, but when I come back to first view, all of handlers/listeners seems to be disactivated..

Any help would be appreciated. My CODE:

app.js:

Ext.Loader.setConfig({ enabled: true });


Ext.application({
    name: 'MVC',


    controllers: ['Main']
});

view/main.js:

Ext.define('MVC.view.Main', {
    extend: 'Ext.Panel',
    alias: 'widget.main',
    
    initialize : function() {
        this.callParent();  
    },
    
    config: {
        fullscreen: true,
        items: {
            xtype: 'toolbar',
            docked: 'top',
            items: [{
                xtype: 'button',
                id: 'CLICK',
                text: 'CLICK'
            }]
        }
    }
});

view/second.js:

Ext.define('MVC.view.Second', {
    extend: 'Ext.Panel',
    alias: 'widget.second',
    
    initialize : function() {
        this.callParent();  
    },
    
    config: {
        fullscreen: true,
        items: {
            xtype: 'toolbar',
            docked: 'top',
            items: [{
                xtype: 'button',
                id: 'KLIK2',
                text: 'KLIK2'
            }]
        }
    }
});

controller/main.js:

Ext.define('MVC.controller.Main', {
    extend: 'Ext.app.Controller',


    config: {
        profile: Ext.os.deviceType.toLowerCase()
    },


    views : [
        'Main',
        'Second'
    ],
    
    refs: [{
        ref: 'main',
        selector: 'mainview',
        autoCreate: true,
        xtype: 'mainview'
    }, {
        ref: 'second',
        selector: 'secondview',
        xtype: 'secondview'
    }],


    init: function() {
        this.getMainView().create();
        
        this.control({
            '#CLICK': {
                'tap': function() {
                    Ext.Viewport.setActiveItem({xtype:'second'});
                }
            },
            
            '#CLICK2': {
                'tap': function() {
                    Ext.Viewport.setActiveItem({xtype:'main'});
                }
            }
        });
    }
});

[stan229]

Have a look at this Q&A thread, it covers your same question:

http://www.sencha.com/forum/showthre...ttons-with-MVC

[Surykat]

I tried that solution and it didn't worked for me. That's the reason of the new thread which I have opened. Any other possible ideas?

[Möhre]

I´ve got problems with view switching too.

Sencha need´s to provide an example of a typical CRUD-App in MVC-style!
Tabpanel with homepanel & listview, show editview on tap and switch back to listview after saving to localstore.

This would make things much easier esp. for beginners!