Question

I have created a plugin with following codes:

var myplugin = {
    init: function(options) {
         $.myplugin.settings = $.extend({}, $.myplugin.defaults, options);
    },
    method1: function(par1) {
        .....
    },
    method2: function(par1) {
        .....
    }
};
$.myplugin = function(method){
     if ( myplugin[method] ) {
    return myplugin[ method ].apply( this, Array.prototype.slice.call( arguments, 1 ));
     } else if (typeof method === 'object' || !method) {
        return myplugin.init.apply(this, arguments);
     } else {
    $.error( 'Method "' +  method + '" does not exist in myplugin!');
     }
};
$.myplugin.defaults = {
     option1: 'test',
     option2: '',
     option3: ''
};
$.myplugin.settings = {};
$.myplugin();

This works well but the issue is that when I try to set more than 1 option and try to return its values afterwards, it gives empty; setting one option works well. For eg.
If on changing the first combo box value I call this:
$.myplugin({option1: ‘first test’});
it works, but when I try to call another on second combo box it doesn’t save the option, instead it reset to empty.

Is there any fix?

Answer 1

I would re-organize the plugin to use this structure:

var methods = {
    settings: {
        foo: "foo",
        bar: "bar"
    },
    init: function(options) {
        this.settings = $.extend({}, this.settings, options);
    },
    method1: function(par1) {
        alert(this.settings.foo);
    },
    method2: function(par1) {
        alert(this.settings.bar);
    }
};

function MyPlugin(options) {
    this.init(options);
    return this;
}
$.extend(MyPlugin.prototype, methods);
$.myPlugin = function(options) {
    return new MyPlugin(options);
}

/* usage */

// without parameters
var obj1 = $.myPlugin();
// with parameters
var obj2 = $.myPlugin({foo: "foobar"});
// each has it's own settings
obj1.method1();
obj2.method1();

Demo: http://jsfiddle.net/ypXdS/

Essentially $.myPlugin simply creates and returns a new instance of the MyPlugin class. You could get rid of it completely and use new myPlugin(options) in it’s place.