Javascript Synchronization with JSON Requests

How can I make sure that a piece of code has executed completely before executing another? I am sending some ajax requests to a server and then using the returned data to generate the rest of the webpage. the things is, is that i need to have all that data in the webpage to proceed with the rest of the code as that code will affect what has been generated and, that code, runs before the json requests and all of that have finished... is there any way I can make sure this does not happen? I managed to solve it by performing the requests and then asking th开发者_JS百科e user to press a button but that is a total no-sense way of doing it.

Any ideas?

Here is some code: The problem is that the second line is executed before the first (there are many calls to similar JSON functions).

$.getJSON(url, function(data){ $("#mycontent").append("..... stuff here...... create loads of dibs with class set to mydivclass"); });
...
$("div.mydivclass").hide();

Unforunately I cannot use the ajax synchronous property because: "dataType: "jsonp" requests do not support synchronous operations"

If you are using jQuery 1.5+ you can make use of deferreds to solve your issue:

function first_ajax_request() {
    return jQuery.ajax(
         // Your settings here
         success: success_function_1
    );
}

function second_ajax_request() {
    return jQuery.ajax(
         // Your settings here
         success: success_function_2
    );
}

function final_sucess_callback() {
    // Do all your display work.
}

jQuery.when(first_ajax_request(), 
            second_ajax_request()).then(final_success_callback);

There is an excellent article on the topic that you should read up on as well by Eric Hynds. He gives some examples of exactly the kind of problem you are trying to solve.

jquery requests are asynchonize by default , so your code does not wait for the response , so you have no guarantee that code after request will execute after the response , so you can set the request synchronize by set the async property false , now the request is synchronize and you can gurantee the rest of the code will execute after the response from the server , like this .

$.ajax({
   url: "page.php",
   processData: false,
   data: xmlDocument,,
   async:false,
   success: handleResponse
 });