CODEWITHSUNDEEP
javascriptjquery
1252748
1252748

Reputation: 15372

calling three subsequent callback functions

I'm trying to apply what I learned about callback functions in this post I made to extend to 3 functions, but am having some trouble getting things working. Can someone please help me understand how I can get these three functions to fire in sequence?

var yourCallback = function(args, second) {
    var t = setTimeout(function() {
        $('body').append(args);
    }, 800);

    second('3-');


}

var yourSecondCallback = function(args) {
    var t = setTimeout(function() {
        $('body').append(args);
    }, 800);
}

function function1(args, callback, yourSecondCallback) {
    $('body').append(args);
    if (callback) {
        callback('2-');
    }

}


function1('1-' , yourCallback);​

http://jsfiddle.net/loren_hibbard/WfKx2/3/

Thank you very much!

Upvotes: 0

Views: 1557

Answers (5)

Arena Hernandez
Arena Hernandez

Reputation: 51

I have a function, mainMethod, that is calling three callback functions.

mainFunction the first callback function(one) will be called and the first parameter will be passed into it.

one will pass the second parameter into the second callback function (two).

two will pass the third parameter into the last callback function (three).

three will just log the last parameter that was passed into it.

function mainFunction(callback1, callback2, callback3){

      var first_parameter = "ONE"
      callback1(first_parameter);
}


function one(a){

         console.log("one: " + a);
         var second_parameter = "TWO"
         two(second_parameter);
}

function two(b){

         console.log("two: " + b);
         var third_parameter = "THREE";
         three(third_parameter);
}

function three(c){

         console.log("three: " + c);
}


mainFunction(one, two, three);

Upvotes: 0

Atif
Atif

Reputation: 10880

If your first argument and only is going to be an input for all the callbacks then this code can be used for unlimited arguments

var yourCallback = function(args, second) {
    var t = setTimeout(function() {
        $('body').append(args + ' first function');
    }, 800);

}

var yourSecondCallback = function(args) {
    var t = setTimeout(function() {
        $('body').append(args + ' second function');
    }, 800);
}

function function1(args) {
    var callbacks = arguments.length - 1;
    for (i = 1; i < arguments.length; i++) {
        if (typeof(arguments[i] == 'function')) {
            arguments[i](arguments[0]);
        }
    }
}


function1('1-', yourCallback, yourSecondCallback);​

Fiddle - http://jsfiddle.net/8squF/

Upvotes: 0

Ben Lesh
Ben Lesh

Reputation: 108491

You need to nest the callbacks to get them to call in order.

var yourCallback = function(args, second) {
    var t = setTimeout(function() {
        $('body').append(args);
        second('3-');
    }, 800);
}

var yourSecondCallback = function(args) {
    var t = setTimeout(function() {
        $('body').append(args);
    }, 800);
}

function function1(args, callback) {
    $('body').append(args);
    if (callback) {
        callback('2-', yourSecondCallback);
    }

}


function1('1-' , yourCallback);​

Here's your altered fiddle

Upvotes: 1

Matt Burland
Matt Burland

Reputation: 45135

Not sure exactly what you are trying to do here, but when you do this in function1:

callback('2-');

You are calling this method:

var yourCallback = function(args, second)

But you are not providing a value for second, so you get an error.

Upvotes: 0

Madbreaks
Madbreaks

Reputation: 19539

Your function names confuse me, so I'm just going to make some up to demonstrate a simple approach:

function1('-1', function(){
    secondCallback(...);
    thirdCallback(...);
    ...
});

Any reason a simple approach like that won't work for you?

Upvotes: 0

Related Questions