Search code examples
javascriptjqueryloadready

Ajax call wait till is loaded

I can't seem to figure this out. I have an Ajax call with Jquery and when the server response is done is have an element reloaded like this $('#test').load(document.URL + ' #test');.

Display property of the element's style is set to none. After the response is done I would like to refresh the element and when that is done than show that element.

when I try this

.done(function() {
  $('#test').load(document.URL +  ' #test');
  $('#test').show();
});

The element will show but the refresh is not done so it will hide after a second.

I aslo tried to put it in a variable and call the ready function on the variable like this:

.done(function() {
  var ready = $('#test').load(document.URL +  ' #test');
  $(ready).ready(function() {
    $('#test').show();
  });
});

Also not working.

How can I let show() wait till the previous line of code is ready?

THNX!

Solution

  • You can use the jQuery .load's callback like below:

    ....
     $('#test').load(document.URL +  ' #test', function(){
            //PAGE LOADED
             $('#test').show();
     });

....