Ajax и JQuery: убедившись, что страница HTML визуализируется правильно

Question

Извините, если я буду писать неточности, но я довольно новый для AJAX и JQuery

Я это

$(document).ready(function() { 
}) 

, который содержит два Аякс GET;

Первый получает HTML-код из шаблона и загружает его в текущую страницу. Второй загружает содержимое из файла XML и загружает его на текущую страницу.

Как я могу убедиться, что страница правильно отображена с гарантией того, что второй GET уволен после первого успеха? Как бы то ни было, иногда страница заполняется, иногда нет. Спасибо.

EDIT: это фактический код, я использую:

<script> 
     var page; 
     $(document).ready(function() { 
      $.ajax({ 
       type : "GET", 
       url : "template.html", 
       dataType : "html", 
       success : function(html) { 
        $('body').load('template.html #generalBox'); 
        $.ajax({ 
         type : "GET", 
         url : "content.xml", 
         dataType : "xml", 
         success : function(xml) { 
          page = $(xml).find('aTag'); 
          $('#content').html(page.text()); 
//other loadings 
         } 
        }); 

       } 
      }); 

     }); 

    </script> 

EDIT2:

resloved: проблема была в

    $('body').load('template.html #generalBox'); 

, который, казалось, ведут себя асинхронно от остальной части код. Я загрузил HTML, используя

success : function(html) { 
        var ndoc = document.createElement('html'); 
        ndoc.innerHTML = html; 
        page = $('body', ndoc); 
        $('body').html(page.html()); 
//2nd get 

и он отлично работает сейчас.

Answer 1

Вызвать второй GET из обратного вызова 1-го GET после внесения изменений DOM, чтобы второй запрос был выполнен, когда данные из первого GET уже загружены.

Очень общий пример использования .ajax():

// 1st GET 
$.ajax({ 
    // ... 
    success: function(){ 
    // ... 

    // 2nd GET 
    $.ajax({ 
    // ... 
    }); 
    } 
}); 

EDIT:

.load() загружается содержимое асинхронно, так что вам нужно вызвать второй ПОЛУЧИТЬ после в .load() отделки с использованием дополнительного обратного вызова - см documentation.

Try:

$.ajax({ 
    // ... 
    success : function(html) { 
    $('body').load('template.html #generalBox', function() { 
     // 2nd GET should be executed in the callback of .load() 
     $.ajax({ 
     // ... 
     }); 
    }); 
    } 
}); 

Answer 2

$(document).ready(function() { 
$.ajax({ 
    url : "Your server url", 
    data : "data to posted", 
    type : "GET", 
    success :function(){ 
     //call your second ajax here... 
} 
}); 

})