Jquery, ajax() et each(), comment attendre jusqu'à ce que toutes les infos soient vraiment chargées?

Question

J'ai une fonction utilisant $ .ajax() pour obtenir des valeurs d'un fichier XML, quand l'information est chargée et l'événement de succès est déclenché, j'utilise $ (xml) .find (''). Each (function() { }); pour remplir quelques vars ...

function getData() 
{ 
    $.ajax({ 
     type: 'GET', 
     url : 'info.xml', 
     dataType: 'xml', 
     success: function(xml) 
     { 
      $(xml).find('DATAS').each(function() 
      { 
       date = new Date($(this).attr('DATE')); 
       alert(date); 
      }) 
        //Here I have a bigger find/each that should take more time 
     }, 
      error: function() 
      { 
        return false; 
      } 

    }); 
} 

Dans ce cas, lorsque je déclenche la fonction du document fonction prêt, l'alerte montre les bonnes données, mais si je supprime l'alerte de la fonction et essayer cette place, date ne sera pas encore définie:

$(document).ready(function() 
{ 
if(getData() != false) 
{ 
    alert(date); 

    } 
}); 

Je suppose que dans ce cas, les données ne sont pas encore prêtes? Existe-t-il un moyen de garder le contrôle lorsque la traversée each() est terminée et prête?

Answer 1

Cela se produit parce que AJAX est asynchrone, ce qui signifie que l'appel $.ajax() ne se termine pas avant le if() ... le termine alert() de la manière donne juste le temps de terminer. Vous devez lancer toute opération qui doit utiliser les données à l'intérieur du rappel success, lorsqu'il est exécuté, les données sont alors disponibles. Quelque chose comme ceci:

$(function() { 
    getDataAndDoSomething(); 
    //other ready stuff... 
}); 
function getDataAndDoSomething() { 
    $.ajax({ 
    type: 'GET', 
    url : 'info.xml', 
    dataType: 'xml', 
    success: function(xml) { 
     $(xml).find('DATAS').each(function() { 
      date = new Date($(this).attr('DATE')); 
      alert(date); 
     }) 
     //Do the other stuff depending on the date data 
    } 
    }); 
} 

Answer 2

.ajax() lance une requête asynchrone, ce qui signifie que getData() retournera immédiatement. Vous devez faire toutes sortes d'agir sur les données renvoyées au sein de votre gestionnaire de succès ou, définissez la demande .ajax à syncronous en ajoutant

$.ajax({ 
    async: false 
});