A number of times, I have to write a callback function.

Example 1: myTransaction.executeSql(stmt,parameters,mySuccess,myError);

Example 2: $.getScript(url [, mySuccess])

Q: Is there a way to tell JavaScript, "Please execute this line of code, and when you're done, execute the next line of code"?

I don't want to lock up the browser session, I just want it to not run the next line until it's done.

A number of times, I have to write a callback function.

Example 1: myTransaction.executeSql(stmt,parameters,mySuccess,myError);

Example 2: $.getScript(url [, mySuccess])

Q: Is there a way to tell JavaScript, "Please execute this line of code, and when you're done, execute the next line of code"?

I don't want to lock up the browser session, I just want it to not run the next line until it's done.

• javascript

5 Answers 5

Put the call to the second function in the mySuccess handler function for the first function call. When the first one pletes and runs the mySuccess function, that function will then call the second one. That is the design pattern for sequencing asynchronous operations.

You cannot write normal sequential function calls with asynchronous operations. You must use the pletion functions to do your sequencing.

Here's an example using an anonymous success handler for the first function:

myTransaction.executeSql(stmt,parameters,function() {
    $.getScript(url, mySuccess);
}, myError);

No there is not a way to exactly what you want. But you can use a library that helps make this less hard, like Step: https://github./creationix/step

Step(
  function() { myTransaction.executeSql(stmt, parameters, this, myError) },
  function() { $.getScript(url, this); },
  function() { alert('done'); }
);

Or you will need to manually nest the callbacks.

The Javascript library Step provides a framework that encapsulates the solution suggested by @jfriend00.

You can put step 2's call in step 1's success/plete callback, as already mentioned.

Or you can look into the promise/deferred paradigm. It's a little plicated, so I won't try and explain it concisely here (and get it wrong). But given that you already seem to be using jQuery you can probably use its implementation of the deferred object. Here are a couple of articles you can read (though there are plenty more that you'll find with Google):

http://blogs.msdn./b/ie/archive/2011/09/11/asynchronous-programming-in-javascript-with-promises.aspx

http://joseoncode./2011/09/26/a-walkthrough-jquery-deferred-and-promise/

http://www.infoq./articles/surviving-asynchronous-programming-in-javascript

Frame.js is another library, similar to Step, that solves this problem eloquently and provides a host of advantages over setTimeouts or nested callbacks.