Sencha Touch 2-How to removeAll() in a controller from a store in a view?

Question

I want to use the function removeAll() of stores in my controller, to delete the content of the store in the view.Is it possible? Here is my code:

My View:

Ext.define('demoapp.view.MainMenu',{
extend:'Ext.form.Panel',
requires:['Ext.TitleBar','demoapp.store.CCAA'],
alias:'widget.mainmenuview',
config:{
    layout:{
        type:'fit'
    },
    items:[{
        xtype:'fieldset',
        items:[{
            xtype:'titlebar',
            title:'Menú principal',
            docked:'top',
            items:[{
                xtype:'button',
                text:'Desconectar',
                itemId:'logOffButton',
                align:'right'
            }]
        },
        {
            xtype:'fieldset',
            items:[{
                xtype:'selectfield',
                itemId:'CCAAcombo',
                label:'Comunidad Autonoma',
                store:'storeCCAA',
                displayField:'nombre',
                valueField:'id',
                autoSelect:false,
                placeHolder:'Elige una para filtrar'
            }]
        }
        ]
    }],
    listeners:[{
        delegate:'#logOffButton',
        event:'tap',
        fn:'onLogOffButtonTap'
    },
    {
        delegate:'#CCAAcombo',
        event:'change',
        fn:'onCCAAcomboChange'
    }]
},
onLogOffButtonTap:function(){
    this.fireEvent('onSignOffCommand');
},
onCCAAcomboChange:function(field,value){
    console.log("ESTOY EN LA VISTA");
    var idCCAA=value;
    console.log(idCCAA);
    this.fireEvent('onCCAAcomboChangeAction',idCCAA);
}
});

My controller:

Ext.define('demoapp.controller.MainMenu',{
extend:'Ext.app.Controller',
config:{
    refs:{
        loginView:'loginview',
        mainMenuView:'mainmenuview'
    },
    control:{
        mainMenuView:{
            onSignOffCommand:'onSignOffCommand',
            onCCAAcomboChangeAction:'onCCAAcomboChangeAction'
        }
    }
},

//Transicion
getSlideRightTransition: function () {
    return { type: 'slide', direction: 'right' };
},

//Funciones
onSignOffCommand:function(){
    var me=this;

    Ext.Viewport.animateActiveItem(this.getLoginView(),this.getSlideRightTransition());

},
onCCAAcomboChangeAction:function(idCCAA){
    console.log("ESTOY EN EL CONTROLADOR");
    console.log(idCCAA);
}
});

In the controller,after the line var me=this in onSignOffCommand:function() I want to use the removeall() function of the store:'storeCCAA' of the view.

Answer 1

Add a refs for selectfield in controller

Ext.define('demoapp.controller.MainMenu',{
    extend:'Ext.app.Controller',
    config:{
        refs:{
            loginView:'loginview',
            mainMenuView:'mainmenuview',
            mainMenuViewSelectField: 'mainmenuview selectfield#CCAAcombo'
        },
        control:{
            mainMenuView:{
                onSignOffCommand:'onSignOffCommand',
                onCCAAcomboChangeAction:'onCCAAcomboChangeAction'
            }
        }
    },

    //Transicion
    getSlideRightTransition: function () {
        return { type: 'slide', direction: 'right' };
    },

    //Funciones
    onSignOffCommand:function(){
        var me=this;

        // Get the store of select field and remove the records
        this.getMainMenuViewSelectField().getStore().removeAll();
        Ext.Viewport.animateActiveItem(this.getLoginView(),this.getSlideRightTransition());

    },
    onCCAAcomboChangeAction:function(idCCAA){
        console.log("ESTOY EN EL CONTROLADOR");
        console.log(idCCAA);
    }
});