Javascript - passing parameter to function which calls another function

Question

Okay my title is a bit confusing but basically, I have a function and after that function is finished executing, it should do the given steps. Here is my javascript:

createSideTable(showThis, function() {
    $('#' + showThis + 'Screen').slideDown('slow');
});

I want the createSideTable function to run all it's code before the step

$('#' + showThis + 'Screen').slideDown('slow');

can get executed. The createSideTable more or less just makes a side table fade in slowly. The function can be seen at the end of this post. Normally, when I have a function which I want to execute all it steps and then execute other given steps, i'd do it like this

createSideTable(function() {
    $('#' + showThis + 'Screen').slideDown('slow');
});

and it works, however, the createSideTable function needs a parameter (the parameter which it needs is showThis). So when I tried

createSideTable(showThis, function() {
    $('#' + showThis + 'Screen').slideDown('slow');
});

it did create the sideTable however, this step

$('#' + showThis + 'Screen').slideDown('slow');

didn't get executed after it created the sideTable. How come? This is my createSideTable function.

function createSideTable(test) {
    var key = test.substr(test.length -1); //index of Heading
    for (var i=0; i<window['headings' + key].length; i++) {
        if (i == 0) {
            $('#row' + i).addClass('subHeadingClicked');
        }

        $('#row' + i).text('').removeClass('column1invisible');
        $('#row' + i).append(window['headings' + key][i]);
    }
    $('#sideTable').fadeIn(1500);
}

Is your createSideTable function calling the callback? Can you post that function's code? — Jason P
– Jason P, Commented Oct 23, 2013 at 17:23
@JasonP Hm I'm not doing a callback.. I put up the createSideTable function. How would I do a call back? Should I just add 'callback();' at the end of my createSideTable function or do I need to pass another parameter called 'callback' to the createSideTable function? — SilentDev
– SilentDev, Commented Oct 23, 2013 at 17:28

Jason P · Accepted Answer · 2013-10-23 17:30:05Z

3

Add the callback parameter, and if it exists, call it at the end:

function createSideTable(test, callback) {
    var key = test.substr(test.length -1); //index of Heading
    for (var i=0; i<window['headings' + key].length; i++) {
        if (i == 0) {
            $('#row' + i).addClass('subHeadingClicked');
        }

        $('#row' + i).text('').removeClass('column1invisible');
        $('#row' + i).append(window['headings' + key][i]);
    }
    $('#sideTable').fadeIn(1500);

    if (callback) callback();
}

And you should be able to call it like this:

createSideTable(showThis, function() {
    $('#' + showThis + 'Screen').slideDown('slow');
});

Edit -

The first example was showing how a callback works. You can execute the callback where ever you want... for example, if you want it to be executed after the fadeIn(), you could do this:

function createSideTable(test, callback) {
    var key = test.substr(test.length -1); //index of Heading
    for (var i=0; i<window['headings' + key].length; i++) {
        if (i == 0) {
            $('#row' + i).addClass('subHeadingClicked');
        }

        $('#row' + i).text('').removeClass('column1invisible');
        $('#row' + i).append(window['headings' + key][i]);
    }
    $('#sideTable').fadeIn(1500, function() {
        if (callback) callback();
    });
}

answered Oct 23, 2013 at 17:30

Jason P

27k3 gold badges34 silver badges45 bronze badges

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

2 Comments

Bergi Over a year ago

Why would one use a callback for that? It only might make sense to pass the callback into the fadeIn method.

Jason P Over a year ago

@Bergi You're right, it was all synchronous, which doesn't make sense. My edit might make more sense.

Collectives™ on Stack Overflow

Javascript - passing parameter to function which calls another function

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related