Setting default parameters in jQuery plugin

Question

I'm looking for a way to set a default numerical value to my defaults parameters of my plugin or have the option to retrieve the default value via an ajax call. In other words:

  var defaults = {
        param1: 1000,
        totalTime : null // the default value i'm looking for in seconds
    }

So that:

$('.test').myPlugin({
    param1: 1000,
    totalTime: function () {
        $.ajax({
            url: 'totaltime.php',
            type: 'POST',
            success: function(data) {
                // retrieve value here
            }
        });         

    }
});

OR 

$('.test').myPlugin({
    param1: 1000,
    totalTime: 200 // numerical
});

I only recently started playing with plugins and found this an interesting concept but am having a little trouble with it. Here's what my plugin looks like now (the basic set up for new plugin).

(function($) {
    $.fn.myPlugin = function(options) {

        var plugin = this;

        var defaults = {
            param1: 1000,
            totalTime : null
        }

        plugin.init = function() {
            plugin.settings = $.extend({}, defaults, options);
            plugin.timer();
        }   

        plugin.settings = {}

        plugin.timer = function() {

        }

        plugin.init();
        return this;

    };

})(jQuery);

Amin Jafari · Accepted Answer · 2014-06-22 18:34:34Z

1

just define your defaults like this:

var defaults =$.extend( {
        param1: 1000,
        totalTime : null
    },options);

and then you can use it like defaults.param1 or defaults.totalTime

UPDATE:

the above example is how you can set the totalTime value numerically as default.

if you wanna change it during your plugin then you can do this:

defaults.totalTime=500;

or

defaults.totalTime=givenVal; //givenVal is a variable that contains the value

also in your jQuery code, you can set the totalTime as this:

$('#test').myPlugin({
    totalTime:500
});

or

$('#test').myPlugin({
    totalTime:givenVal
});

so now all you should do is to get the value from ajax, put it in a variable, and pass it to your plugin as mentioned above!

edited Jun 22, 2014 at 18:34

answered Jun 22, 2014 at 17:56

Amin Jafari

7,2153 gold badges21 silver badges44 bronze badges

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

3 Comments

Dimitri Over a year ago

But how does this allow me to use an ajax function get my wanted value versus just putting a simply value for totalTime?

Amin Jafari Over a year ago

you mean you wanna get the value of totalTime from ajax and then use it on an element? if yes, is the ajax call inside your plugin or outside?

Dimitri Over a year ago

I want to get the totalTime value via ajax and use it to do calculate something in my plugin. I want to either put the value numerically or get the value via ajax.

PeterKA · Accepted Answer · 2014-06-22 18:16:48Z

0

@AminJafari has indicated how to correctly define your defaults. Below is how to call your plugin with a value from an ajax request. NOTE: the totalTime callback has to return a value, and the value has to be available to be returned. -- which means it's got to be done in the success callback of the ajax request:

    $.ajax({
        url: 'totaltime.php',
        type: 'POST',
        success: function(data) {
            $('.test').myPlugin({
                param1: 1000,
                totalTime: function () {
                    // retrieve value here
                    return data.timeValue; //for example
                }
            });
        }
    });

answered Jun 22, 2014 at 18:16

PeterKA

24.7k5 gold badges28 silver badges52 bronze badges

2 Comments

Dimitri Over a year ago

So there's no way to assign the value from ajax without wrapping my entire plugin in $.ajax ?

PeterKA Over a year ago

You could make your request synchronous but that means you've taken the A out of AJAX = SJAX. Just note that synchronous request freeze your browser until the request is completed.

Collectives™ on Stack Overflow

Setting default parameters in jQuery plugin

2 Answers 2

3 Comments

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

3 Comments

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related