Jquery: How To Make An Ajax Request And Continue Without Waiting For Request To Complete?

I want to make an AJAX request 'in the background' of my JavasSript function, but my script waits for the AJAX request to complete before it continues to execute my code. $('div').

Solution 1:

You code should already be doing the Ajax request "in the background" (asynchronously). The jQuery.get() method is shorthand for:

$.ajax({url:url,data:data,success:success,dataType:dataType});

And the jQuery.ajax() method is async: true by default.

Solution 2:

Put the slideDown() in the success callback

$('div').hide();

$.get('/controller/action', { id: 'abc123' },
    function(data){
        alert("Request completed");
        //now update the div with the new data
        $('div').slideDown('slow');
    }
);

Unless you are providing default config for AJAX with async: false (doc).

Solution 3:

is it possible the the div contains nothing untill the ajax request is complete, and therefore creates the illusion that its waits?

have you tried the good old alert() debugging after the ajax request?