Proper way to create an instance variable using jQuery UI Widget Factory

Question

I'm using the jQuery UI widget factory.

$.widget("myPlugin" , {

    options: {
    },

    _create: function() {
    },

    instanceVar: "huzzah!"

});

On testing, it looks as though instanceVar is actually part of the prototype. So it is the same across all instances of the plugin.

I can fix this by putting instanceVar into options, like so:

$.widget("myPlugin" , {

    options: {
        instanceVar: "huzzah!"
    },

    _create: function() {
    },

});

However that seems odd, as instanceVar is just an internal variable for use by the plugin -- not something the user of the plugin should be able to change.

Is there another (better) way to achieve this?

Thanks for your help!

Answer 1

You can store private data on the instance itself, for example, inside the _create, you should be able to do this.instanceVar = "huzzah!"

$.widget("ui.myPlugin", {

    options: {
        foo: "foo"
    },

    _create: function() {
        this.instanceVar = "huzzah!"
    },

    _setOption: function() {
        this.instanceVar = "worky!";
    },

    destroy: function() {
        console.log(this.instanceVar);  
    }

});

$(document).myPlugin().myPlugin("option","foo","bar").myPlugin("destroy"); // "worky"

$("body").myPlugin().myPlugin("destroy"); // "huzzah!

Demo: http://jsfiddle.net/PGUqr/