How to access one function's variable in another function in Extjs4?

Question

I am working in extjs4. I have a view with checkboxes. In a controller I have written a function to get these checkbox values.

chekfeature: function (cmp) {
    cmp.mon(cmp.getEl(), 'click', function (event, target) {
            getFeatureId = target.id;
            console.log(getFeatureId);
            return getFeatureId;
        }, this, {
            delegate: 'input'
        });
},

So I'm getting the checkboxes values in getFeatureId. I want to access this variable in another function of same controller. I tried this:

getFeature:function()
{
     $getvalue = this.chekfeature();
}

But that's not working. So how do I access one functions variables in another function?

Answer 1

First of, I think you need to look at some javascript basics...Then if you get that, have a look sencha's examples and tutorials.

In a view you have checkbox components.

In the controller you listen for the change event

If you have another function in the controller where you need that value, you pass it as a variable, to the function where you need it (=basic javascript) or you get the checkbox component and call the getValue() method.

Here is an example: http://jsfiddle.net/Vandeplas/fDces/

//Defining a Controller
Ext.define('AM.controller.Pizza', {
    extend: 'Ext.app.Controller',

    init: function () {
        this.control({
            'viewport > panel': {
                render: this.onPanelRendered
            },
            'checkbox': {
                change: this.onCheckChange
            },
            'button[action=orderPizza]' : {
                click: this.onOrderPizza
            }
        });
    },

    onCheckChange: function (checkbox, newValue, oldValue, eOpts) {
        console.log(newValue ? 'you checked ' + checkbox.boxLabel : 'you unchecked ' + checkbox.boxLabel);
    },

    onOrderPizza: function(button, e, eOpts){
        var checkboxes = button.up('form').query('checkbox');
        Ext.each(checkboxes, function(chk){
            console.log(chk.boxLabel +  ': ' + chk.getValue());
        });
    },

    onPanelRendered: function () {
        console.log('The panel was rendered');
    }
});
//Defining a View
Ext.define('AM.view.CheckForm', {
    extend: 'Ext.form.Panel',
    alias: 'widget.checkform',

    title: 'Choose toppings',

    initComponent: function () {
        this.items = [{
            xtype: 'fieldcontainer',
            fieldLabel: 'Toppings',
            defaultType: 'checkboxfield',
            items: [{
                boxLabel: 'Anchovies',
                name: 'topping',
                inputValue: '1',
                id: 'checkbox1'
            }, {
                boxLabel: 'Artichoke Hearts',
                name: 'topping',
                inputValue: '2',
                checked: true,
                id: 'checkbox2'
            }, {
                boxLabel: 'Bacon',
                name: 'topping',
                inputValue: '3',
                id: 'checkbox3'
            }]
        }, {
            xtype: 'button',
            text: 'Order',
            action: 'orderPizza'
        }];

        this.callParent(arguments);
    }
});
//Creating the application
Ext.application({
    requires: ['Ext.container.Viewport'],
    name: 'AM',

    appFolder: 'app',
    controllers: ['Pizza'],

    launch: function () {
        Ext.create('Ext.container.Viewport', {
            layout: 'fit',
            items: [{
                xtype: 'checkform'
            }]
        });
    }
});