Menu
I Have the following function.
function ChangeDasPanel(controllerPath, postParams) { $.post(controllerPath, postParams, function(returnValue) { $('#DasSpace').hide("slide", { direction: "right" }, 1000, function() { $('#DasSpace').contents().remove(); $('#DasSpace').append(returnValue).css("display", "block"); $('#DasSpace').show("slide", { direction: "right" }, 1000); }); }); }; But I want to be able to call it like this
ChangeDasPanel("../Home/Test", {} ,function (){ //do some stuff on callback } How can I implement support for callbacks in my function?
801
Passing a function to another function or passing a function inside another function is known as a Callback Function. Syntax: function geekOne(z) { alert(z); } function geekTwo(a, callback) { callback(a); } prevfn(2, newfn); Above is an example of a callback variable in JavaScript function.
In JavaScript, when we pass a function to another function as a parameter, it is called a callback function. The function takes another function as a parameter and calls it inside. A callback function makes sure that a function will not run until the task completes.
To prevent this from happening jQuery provides a callback function for each effect method. A callback function is a function that is executed once the effect is complete. The callback function is passed as an argument to the effect methods and they typically appear as the last argument of the method.
A custom callback function can be created by using the callback keyword as the last parameter. It can then be invoked by calling the callback() function at the end of the function. The typeof operator is optionally used to check if the argument passed is actually a function.
function ChangeDasPanel(controllerPath, postParams, f) { $.get( controllerPath, postParams, function(returnValue) { var $DasSpace = $('#DasSpace'); $DasSpace.hide( "slide", { direction: "right" }, 1000, function() { $DasSpace.contents().remove(); $DasSpace.append(returnValue).css("display", "block"); $DasSpace.show("slide", { direction: "right" }, 1000); } ); if (typeof f == "function") f(); else alert('meh'); } ); }; You can pass functions like any other object in JavaScript. Passing in a callback function is straight-forward, you even do it yourself in the $.post() call.
You can decide whether you want to have your callback called as part of the $.post() callback or on its own.
57
You know that global variables and functions are evil, so why not put your's into the jQuery namespace:
$.extend({ myFunc : function(someArg, callbackFnk){ var url = "http://example.com?q=" + someArg; $.getJSON(url, function(data){ // now we are calling our own callback function if(typeof callbackFnk == 'function'){ callbackFnk.call(this, data); } }); } }); $.myFunc(args, function(){ // now my function is not hardcoded // in the plugin itself }); Read this post to get a better understanding: Creating callback functions in jQuery
40
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
