CODEWITHSUNDEEP
javascriptextjsextjs4
mike_hornbeck
mike_hornbeck

Reputation: 1622

How to disable custom button with listener

I'm having trouble with disabling button with custom template and a click listener. Here's the button code: 

   items: [
       {
        autoEl: {
        tag: 'div'
        },
        cls: 'btn-save uiBtn blue',
        html: '<label><input type="button" value="SAVE"></label>',
        xtype: 'button',
        listeners:{
        'click': {
            element: 'el',
            fn: function(){
            this.submitForm();
            }
        },
        scope:this
        }                   
    },

Unfortunately inside the click event handler function no. disable(), dom.disabled = 'true' doesn't work. How to disable this kind of button ?

Upvotes: 0

Views: 327

Answers (2)

mike_hornbeck
mike_hornbeck

Reputation: 1622

It turned out, that defining 'this' for the listener function is not the best idea. Instead I saved this as a reference in local property of button and operated on 'hits' being the button itself.

    that: this,
    listeners:{
        'click': function(){
            this.disable();
            this.that.submitForm();
        }

Upvotes: 0

Krzysztof
Krzysztof

Reputation: 16130

You've changed scope of the listener, so this points to something else than button. You should use handler argument:

'click': {
    element: 'el',
    fn: function(e, sender){
        sender.disabled = true;
        this.submitForm();
    }
},

Upvotes: 1

Related Questions