Gelmiş geçmiş en büyük porno sitemiz olan 2pe de her zaman en kaliteli pornoları sunmayı hedefledik. Diğer video sitemiz olan vuam da ise hd porno ağırlıklı çalışmalara başladık.

  1. #1
    Sencha User
    Join Date
    Sep 2010
    Location
    Netherlands
    Posts
    120
    Answers
    3
    Vote Rating
    4
    aacoro is on a distinguished road

      0  

    Cool Answered: Damn scoping, what am I missing??

    Answered: Damn scoping, what am I missing??


    Hi guys,

    I'm testing some things and I thought that I fully understand scoping but I have a issue:

    See the following code:

    Code:
    Ext.define("MyCompany.MyScheduler", {    
    extend                 : 'Sch.panel.SchedulerGrid',
        tbar             : [
            {
                xtype    : 'buttongroup',
                columns    : 3,
                title    : Your menu,
                items    : [
                    {
                        iconCls     : 'icon-prev',
                        handler : function() {
                            this.shiftPrevious();
                        }
                    },
                    {
                        text        : 'Date',
                        menu        : Ext.create('Ext.menu.DatePicker', {
                            handler        : function(datePicker, pickedDate) {
                                var startDateTime = new Date(pickedDate);
                                startDateTime.clearTime();
                                startDateTime.setHours(5);
                                var endDateTime = startDateTime.clone();
                                endDateTime.setHours(21); 
                                return schPanel.switchViewPreset('pnViewPreset', startDateTime, endDateTime);
                            }
                        })
                    },
                    {
                        iconCls     : 'icon-next',
                        handler     : function() {
                            this.shiftNext();
                        }
                    }
                ]
            }
        ],
        initComponent : function() {
            Ext.apply(this, {
                // Setup your static columns
                columns : [
                    { header : 'Header1', sortable: true, width: 150, dataIndex : 'Header1' },
                    { header : 'Header2', sortable: true, width: 100, dataIndex : 'Header2 }
                ]
            });
            
            this.callParent(arguments);
        }
    });
    the problem is
    this.shiftNext() AND this.shiftPrevious()
    In both cases it is telling:
    Uncaught TypeError: Object [object Object] has no method 'shiftNext'
    If I place the entire tbar code in:
    Code:
            Ext.apply(this, {            // Setup your static columns
                columns : [
                    { header : 'Header1', sortable: true, width: 150, dataIndex : 'Header1' },
                    { header : 'Header2', sortable: true, width: 100, dataIndex : 'Header2 }
                ]
            });
            
            this.callParent(arguments);
    Then it is working, but this is a workaround, the real bug is me, i still do not understand it in this context...

    This class is called from another JavaScript file like this:
    Code:
    var scheduler = Ext.create("MyCompany.MyScheduler", {            
                dndValidatorFn    : this.validatorFn,
                viewConfig          : {stripeRows : false, forceFit: true}
    })
    Last edited by aacoro; 19 Aug 2011 at 9:53 AM. Reason: Typo

  2. Scope is tricky, until you get it

    You have to put scope specific code in a template method (constructor, initComponent, onRender, etc) where you can get access to the component instance.

    All you need to think about to figure out the scope is: What is 'this' when the relevant function is parsed.

    Code:
    alert('Right now, "this" is ' + this); 
    Ext.define("MyCompany.MyScheduler", {    
    extend                 : 'Sch.panel.SchedulerGrid',
        tbar             : [
            {
                xtype    : 'buttongroup',
                columns    : 3,
                title    : Your menu,
                items    : [
                    {
                        iconCls     : 'icon-prev',
                        handler : function() {
                            this.shiftPrevious();
                        }
                    },
                    {
                        text        : 'Date',
                        menu        : Ext.create('Ext.menu.DatePicker', {
                            handler        : function(datePicker, pickedDate) {
                                var startDateTime = new Date(pickedDate);
                                startDateTime.clearTime();
                                startDateTime.setHours(5);
                                var endDateTime = startDateTime.clone();
                                endDateTime.setHours(21); 
                                return schPanel.switchViewPreset('pnViewPreset', startDateTime, endDateTime);
                            }
                        })
                    },
                    {
                        iconCls     : 'icon-next',
                        handler     : function() {
                            this.shiftNext();
                        }
                    }
                ]
            }
        ],
        initComponent : function() {
            alert('Right now, "this" is ' + this);
            Ext.apply(this, {
                // Setup your static columns
                columns : [
                    { header : 'Header1', sortable: true, width: 150, dataIndex : 'Header1' },
                    { header : 'Header2', sortable: true, width: 100, dataIndex : 'Header2 }
                ]
            });
            
            this.callParent(arguments);
        }
    });
    In code above, as the class definition is parsed, the code is running in the global context - hence 'this' will point to the window object. But when you create an instance of a class, inside its constructor and any following method calls, 'this' will point to the instance.

  3. #2
    Ext JS Premium Member stevil's Avatar
    Join Date
    Nov 2007
    Location
    Denver, CO
    Posts
    1,045
    Answers
    15
    Vote Rating
    9
    stevil will become famous soon enough

      0  

    Default


    I don't see a definition for shiftNext or shiftPrevious in your examples, so I can't tell where the scope mismatch lies.

    Usually, though, the scope of a button in a toolbar will be the button, though, so you might have to walk the ownerCt chain or use up('xtype of your panel') to get to a containing panel. Try "alert(Ext.ClassManager.getDisplayName(this));" in your handler to confirm.

    stevil

  4. #3
    Sencha User
    Join Date
    Sep 2010
    Location
    Netherlands
    Posts
    120
    Answers
    3
    Vote Rating
    4
    aacoro is on a distinguished road

      0  

    Default


    The definition is from Bryntum: http://bryntum.com/docs/#/api/Sch.panel.SchedulerGrid-method-shiftNext

    h
    mm but alerting is giving me the following error:

    Uncaught TypeError: Object #<Object> has no method 'getDisplayName'
    If I console.log(this) i get the following result:
    Code:
     DOMWindow
    Why is the DOMWindow the scope?
    Last edited by aacoro; 19 Aug 2011 at 10:08 AM. Reason: added console.log output

  5. #4
    Sencha - Community Support Team mankz's Avatar
    Join Date
    Nov 2007
    Location
    Stockholm, Sweden
    Posts
    2,710
    Answers
    33
    Vote Rating
    104
    mankz is a name known to all mankz is a name known to all mankz is a name known to all mankz is a name known to all mankz is a name known to all mankz is a name known to all

      0  

    Default


    Scope is tricky, until you get it

    You have to put scope specific code in a template method (constructor, initComponent, onRender, etc) where you can get access to the component instance.

    All you need to think about to figure out the scope is: What is 'this' when the relevant function is parsed.

    Code:
    alert('Right now, "this" is ' + this); 
    Ext.define("MyCompany.MyScheduler", {    
    extend                 : 'Sch.panel.SchedulerGrid',
        tbar             : [
            {
                xtype    : 'buttongroup',
                columns    : 3,
                title    : Your menu,
                items    : [
                    {
                        iconCls     : 'icon-prev',
                        handler : function() {
                            this.shiftPrevious();
                        }
                    },
                    {
                        text        : 'Date',
                        menu        : Ext.create('Ext.menu.DatePicker', {
                            handler        : function(datePicker, pickedDate) {
                                var startDateTime = new Date(pickedDate);
                                startDateTime.clearTime();
                                startDateTime.setHours(5);
                                var endDateTime = startDateTime.clone();
                                endDateTime.setHours(21); 
                                return schPanel.switchViewPreset('pnViewPreset', startDateTime, endDateTime);
                            }
                        })
                    },
                    {
                        iconCls     : 'icon-next',
                        handler     : function() {
                            this.shiftNext();
                        }
                    }
                ]
            }
        ],
        initComponent : function() {
            alert('Right now, "this" is ' + this);
            Ext.apply(this, {
                // Setup your static columns
                columns : [
                    { header : 'Header1', sortable: true, width: 150, dataIndex : 'Header1' },
                    { header : 'Header2', sortable: true, width: 100, dataIndex : 'Header2 }
                ]
            });
            
            this.callParent(arguments);
        }
    });
    In code above, as the class definition is parsed, the code is running in the global context - hence 'this' will point to the window object. But when you create an instance of a class, inside its constructor and any following method calls, 'this' will point to the instance.

  6. #5
    Sencha - Community Support Team mankz's Avatar
    Join Date
    Nov 2007
    Location
    Stockholm, Sweden
    Posts
    2,710
    Answers
    33
    Vote Rating
    104
    mankz is a name known to all mankz is a name known to all mankz is a name known to all mankz is a name known to all mankz is a name known to all mankz is a name known to all

      0  

    Default


    You'll also need to add this to maintain the scope pointing to the component instance:

    Code:
     {
                        iconCls     : 'icon-prev',
                        scope : this,
                        handler : function() {
                            this.shiftPrevious();
                        }
                    },

  7. #6
    Sencha User
    Join Date
    Sep 2010
    Location
    Netherlands
    Posts
    120
    Answers
    3
    Vote Rating
    4
    aacoro is on a distinguished road

      0  

    Default


    Yeah, thanks, this was my missing link. My code was refering to this in the global context...

    I can work this one out now

Thread Participants: 2

Tags for this Thread