1. #1
    Sencha User
    Join Date
    Aug 2011
    Posts
    9
    Vote Rating
    0
    tommytob is on a distinguished road

      0  

    Default Unanswered: handler inside toolbar

    Unanswered: handler inside toolbar


    I have question,

    I have toolbar with items which have handler, in the handler I want to use a function which is defined in the extended class.

    I want to call the function onButtonClick
    Code:
    Ext.define('App.view.Show', {
        extend: 'Ext.panel.Panel',
    .......
    onButtonClick: function(model, element)
        {
          console.log("test");
        }
    this is my piece of code to run.

    Code:
    Ext.define('App.view.risk.Show', {
        extend: 'App.view.Show',
    ....
    tbar : {
    itemId: 'toolBar',
    items:[
    {
    text:'Bewerken',
    action:'edit',
    tooltip:'Set options',
    iconCls:'button edit',
    handler: this.onButtonClick()
    },
    the this.onButtonClick must call the function inside the extended class.
    only the this is the button object.
    that's is clear to me, but if I can't use this what should I use then.

    greetz thomas

  2. #2
    Sencha User tobiu's Avatar
    Join Date
    May 2007
    Location
    Munich (Germany)
    Posts
    2,681
    Answers
    130
    Vote Rating
    112
    tobiu is a name known to all tobiu is a name known to all tobiu is a name known to all tobiu is a name known to all tobiu is a name known to all tobiu is a name known to all

      0  

    Default


    you can change the scope.

    Code:
    listeners : {
        myEvent : function(){...},
        scope : this
    }
    Best regards
    Tobias Uhlig
    __________

    S-CIRCLES Social Network Engine

  3. #3
    Ext JS Premium Member christocracy's Avatar
    Join Date
    Oct 2006
    Location
    Montreal
    Posts
    381
    Vote Rating
    0
    christocracy is on a distinguished road

      0  

    Default Careful

    Careful


    Note:
    Code:
    handler: this.onButtonClick()
    When you attach the function parenthesis to this.onButtonClick, the function executes IMMEDIATELY at that instant in time.

    What you want to do is attach a reference to the method instead. That method reference will be called at the point in time when the button is clicked.

    Code:
    handler: this.onButtonClick
    And yes, as @tobiu said, you may also attach an option scope for your method reference to execute in.

    Code:
    handler: this.onButtonClick,
    scope: this
    If you don't provide a scope, the method will execute in the scope of the Button itself.
    Last edited by christocracy; 22 Aug 2011 at 6:44 AM. Reason: reference tobiu
    /**
    * @author Chris Scott
    * @business www.transistorsoft.com
    * @rate $150USD / hr; training $500USD / day / developer (5 dev min)
    *
    * @SenchaDevs http://senchadevs.com/developers/transistor-software
    * @twitter http://twitter.com/#!/christocracy
    * @github https://github.com/christocracy
    */

Thread Participants: 2