maintaining scope inside a jquery ui widget

Question

I am having a problem with loosing scope inside a widget. Inside _initialize, this.options does not work, and neither does that.options. How can I access the scope of the widget from this method?

$.widget("myproj.map", {
        options: {
            centerLat: 51.511214,
            centerLong: -0.119824,
        },

        // the constructor
        _create: function () {
            var that = this;
            google.maps.event.addDomListener(window, 'load', this._initialize);
        },
        _initialize: function () {

            var mapOptions = {
                center: new google.maps.LatLng(that.options.centerLat, that.options.centerLong),
                zoom: 11,
            };

To clarify

$.widget("myproj.map", {
        options: {
            centerLat: 51.511214,
            centerLong: -0.119824,
        },

        // the constructor
        _create: function () {
            google.maps.event.addDomListener(window, 'load', this._initialize);
        },
        _initialize: function () {
            console.log(this);
            var mapOptions = {
                center: new google.maps.LatLng(this.options.centerLat, this.options.centerLong),
                zoom: 11
            }; ...code omitted

does not work, when I console.log this in _initialize I get

Window {top: Window, window: Window, location: Location, external: Object, chrome: Object…}

you have commas all over the place... unended };, } etc... — Roko C. Buljan
– Roko C. Buljan, Commented Dec 5, 2013 at 0:32
I think he just omitted the closing of _initialize and widget , missing: } }); — roo2
– roo2, Commented Dec 5, 2013 at 0:36

Community · Accepted Answer · 2017-05-23 12:13:06Z

1

google.maps.event.addDomListener changes what this refers to. you can change it back by calling the bind mehtod

google.maps.event.addDomListener(window, 'load', this._initialize.bind(this));

edited May 23, 2017 at 12:13

CommunityBot

11 silver badge

answered Dec 5, 2013 at 0:47

roo2

6,0712 gold badges34 silver badges45 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Community · Accepted Answer · 2017-05-23 12:03:22Z

0

EDIT: this answer does address rebinding caused by the event handler

var that is scoped inside the _create function, you should be able to access this from within initialize.

new google.maps.LatLng(this.options.centerLat, this.options.centerLong)

check out this similar question about "this"

edited May 23, 2017 at 12:03

CommunityBot

11 silver badge

answered Dec 5, 2013 at 0:30

roo2

6,0712 gold badges34 silver badges45 bronze badges

2 Comments

Tom Over a year ago

I only added in the 'that' variable as I was loosing scope going into the initialize function from the google.maps.event listener

roo2 Over a year ago

ahh i see. added a new answer

Collectives™ on Stack Overflow

maintaining scope inside a jquery ui widget

2 Answers 2

Comments

2 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

2 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related