CODEWITHSUNDEEP
javascriptextjs
ppecher
ppecher

Reputation: 1988

Ext.Button handler config option

    someClass = Ext.extend(someClassB, {
        _someFunctionC{  
           someButton = new Ext.button({  
              handler: function () {
                            this._onClick('click');
                       }
           }),
           _onClick(someMessage){
               Ext.Msg.alert(someMessage);
            }
        }
    }

_onClick eats one parameter; in the above code you put in the 'click' event because you want _onClick to be executed after the user clicks on the button. However, how do you specify this specific 'click' registration AND pass in a local variable as the _onClick parameter at the same time?

As an aside, why do you even have to specify 'click', when the API states that handler always pertains to a click? Is this additional information not unnecessary?

Upvotes: 0

Views: 5723

Answers (4)

dmackerman
dmackerman

Reputation: 2966

Another way that I've found to do this is to pass a custom config option along with your button. Say you wanted to have a splitbutton that could choose the amount of banners to add. (this is from a recent project)

{
xtype: 'splitbutton',
iconCls: 'icon addBanners',
ref: '../addBanner',
text: 'Add Banner',
menu: new Ext.menu.Menu({
    items: [{ 
        text: 'Add 10 Banners',
        scope: this,
        handler: this.addBanner,
        numBanners: 10
    },{
        text: 'Add 20 Banners',
        scope: this, 
        handler: this.addBanner,
        numBanners: 20
    }]
}),                    
scope: this,
handler: this.addBanner,
numBanners: 1
}

And in your function:

addBanner: function(button, event) {
      if (button.numBanners) {
          // do whatever 
      }
}

Upvotes: 1

Rob Boerman
Rob Boerman

Reputation: 2168

You can also create a callback function that inserts extra parameters when it is called:

var button = new Ext.Button({
    handler: this.someFunction.createDelegate(button,['Some message'])
});

Upvotes: 0

ChrisR
ChrisR

Reputation: 14447

So if i understand correctly you want to set the handler config option but set the arguments yourself in one go?

Does this do what you want?

// clicking the button alerts 'Hello World'
new Ext.Button({
    text: 'Test',
    handler: function(value){
        alert('Hello, ' + value);
    }.createCallback('World')
});

Notice the createCallback executed on the anonymous function, this creates a callback function for handler which only gets passed the arguments you pass to createCallback.

Upvotes: 1

Robby Pond
Robby Pond

Reputation: 73484

Typically you set it up like this. No real need to pass parameters since someFunction is a member of your 'class' and has access to any data you'd want.

var button = new Ext.Button({
    handler: this.someFunction
    scope: this
});

someFunction: function() {
   // do something interesting.
}

Upvotes: 1

Related Questions