CODEWITHSUNDEEP
javascriptextjsextjs4
Gihan Lasita
Gihan Lasita

Reputation: 3055

How to access toolbar from a extjs splitbutton menu?

I have a toolbar like this

  tbar: [{
            xtype        : 'textfield',
            name        : 'number',
            itemId        : 'number',
            listeners    : {
                change    : function(t,n){
                        console.log(this.up('toolbar').down('#splitbut')) // i can access splitbutton from here
                }
            }                                                          
        },{
            xtype    : 'splitbutton',
            text    : 'Report',
            disabled: true,
            itemId    : 'splitbut',
            menu    : [{
                    text    : 'details',
                    handler    : function() {
                        // how to access #number text field  from here
                    }
                }

i tried like this.up('menu').up('toolbar') inside menu button handler but im getting undefined message for each way i try

any idea how to access #number text field from menu button?

Regards

Upvotes: 1

Views: 2745

Answers (2)

dbrin
dbrin

Reputation: 15673

Gihan your menu item does not extend from a component that has up function. Try passing in scope to handler function:

handler: function() {
            console.log(this.myTextField ) 
        },
scope: this or this.mySplitButton

set the break point inside the function and inspect it in firebug. you will clearly see what 'this' refers to at that point. Also if you are going to be developing in ExtJS I would strongly recommend you getting Illuminations fro developers for Firefox - you will love it.

Upvotes: 0

svenlol
svenlol

Reputation: 68

I would define the textfield and the splitbutton separately, then reference them that way.

this.myTextField = new Ext.form.field.Text ({
    name: 'number',
    itemId: 'number',
    listeners: {
        change: function(t,n){
            console.log(this.mySplitButton) 
        }
    }    
this.mySplitButton= new Ext.button.Split ({
    text: 'Report',
    disabled: true,
    itemId: 'splitbut',
    menu: [{
        text: 'details',
        handler: function() {
            console.log(this.myTextField ) 
        }
    }

Upvotes: 1

Related Questions