On select / click event of a Ext.RadioGroup

Again Im probably being stupid, I am having trouble with listener events of开发者_如何学编程 objects.

I have:

new Ext.form.Radio({
                    boxLabel:'Yes',
                    id: 'car_price_type_yes',
                    name: 'car_price_type',
                    value: 1,
                    listeners: {
                        select: function (e) {
                            alert('x');
                        }
                    }
                })

I am trying to get the alert to appear when I click the radio button.

Thanks.

The problem comes from the treatment of radio buttons as some kind of non-normal entity. They don't seem call listeners at all.

After wading thru the documentation, forums, source, and everything else, I stumbled on a mention of the handler method and it seems you have to declare them to have a handler (like below) if you want to detect the "click" event, or the "change" event, or the "select" event. The only "event" I've been able to get 4.1.3 to actually produce is to call my handler function, none of the other event names seem to produce anything. Numerous people in the docs point out that change does not always fire, I never managed to get it to fire at all.

{
    boxLabel: 'Field Based'
    , name: 'alert_type'
    , inputValue: 'field'
    , xtype: "radiofield"
    , listeners: {
        // won't be called
        click: function(a,b,c,d) {  
            console.log("FB",a,b,c,d);
        }
        // won't be called
        ,change: function(a,b,c,d) {  
            console.log("Change",a,b,c,d);
        }
        // won't be called
        , select: function(field, newValue, oldValue) { 
            console.log(field, "Radio Selected ", newValue, "to", oldValue);
        }
        // won't be called
        , check: function(field, newValue, oldValue) {
            console.log(field, "Radio Checked ", newValue, "to", oldValue);
        }
    }
    // WILL BE CALLED
    , handler: function(field, state) {
        console.log(field, state, c, d)
    }
},

The handler will produce logging output like:

constructor {boxLabel: "Field Based", name: "alert_type", inputValue: "field", listeners: null, handler: function…}
true

You want the check event. You really should become more familiar with the docs, it will help with this kind of question.

EDIT: Seems that people are unhappy with this answer. OK, as of Ext 4.x it seems that the change event is what you want on radios/checkboxes.