javascript/jquery portée m'a trébuché

Question

J'ai enveloppé un appel ajax commun dans une fonction. Il pings un script, retourne JSON.

Cependant pour la vie de moi je ne peux pas sembler pouvoir avoir l'objet JSON être la valeur de retour de la fonction.

Doit être quelque chose de simple, je suis manquant, bu pour la vie de moi ne peut pas le résoudre.

function queryCostCenter(user_id, currency_id, country_id){ 

    var output = null; 
    var destinations = new Array(); 

    var destination = { qty:1, country: country_id }; 
    destinations.push(destination)   


    var data = { 
       destinations : $.toJSON(destinations), 
       user_id : user_id, 
       currency_id: currency_id 
       }; 

    $.ajax({ 
     data: data, 
     type: 'POST', 
     url: '/lib/ajax/ajax_prepaid_cost_calculator.php', 
     success: function(data) {   
      output = data; 
      alert(output); 
     } 
    }); 

    alert(output); 

    return json; 

} 

L'alerte() à l'intérieur de l'appel ajax() affiche l'objet json, si essayer d'alerte en dehors de la fonction, et/ou retourner la réponse à l'intérieur de l'appel de sa valeur ajax() est nul ?!

Toute aide/pointeur serait appréciée.

Answer 1

$ .ajax() est asynchrone. En bref: l'alerte (sortie) en dehors de votre bloc de fonction sera probablement appelée avant que la méthode async ne renvoie un résultat, par conséquent, elle est toujours nulle.

Answer 2

Erreur typique. Le code après l'appel Ajax

alert(output); 
return json; 

est exécuté, avant l'appel retourne Ajax. C'est asynchrone (ce qui signifie, il n'est pas exécuté quand et où vous l'avez mis dans le code, mais à un moment ultérieur). Vous pouvez fournir un rappel à votre fonction, comme ceci:

// cb is our callback - it is a function 
function queryCostCenter(user_id, currency_id, country_id, cb){ 
    var destinations = new Array(); 

    var destination = { qty:1, country: country_id }; 
    destinations.push(destination)   

    var data = { 
       destinations : $.toJSON(destinations), 
       user_id : user_id, 
       currency_id: currency_id 
       }; 

    $.ajax({ 
     data: data, 
     type: 'POST', 
     url: '/lib/ajax/ajax_prepaid_cost_calculator.php', 
     success: function(result) { // or just `success: cb` 
      cb(result); // execute the callback with the returned data 
     } 
    }); 
} 

alors:

queryCostCenter(some_value, some_value, some_value, function(result) { 
    // do something with the returned data. 
}); 

Ou mettre toute la logique dans le gestionnaire de succès de l'appel Ajax. Mais avec une fonction de rappel, vous êtes plus flexible et vous pouvez mieux réutiliser la fonction.

---

Ceci est un cas d'utilisation très courant pour les rappels. Comme vous ne connaissez pas lorsque l'appel Ajax sera terminé, vous passez une fonction à l'appel Ajax qui devrait être exécuté, lorsque certains résultats sont retournés. Vous ne faites rien d'autre avec le gestionnaire success: C'est une fonction qui est appelée lorsque l'appel est terminé.

Answer 3

vous ne récupérez pas et ne convertissez pas réellement en JSON, juste un gros blob de texte. Regardez la documentation de getJSON, qui est ce que vous devez utiliser.

http://api.jquery.com/jQuery.getJSON/

$.getJSON({ 
    '/lib/ajax/ajax_prepaid_cost_calculator.php', 
    {data:data} 
    , function(data) { 
     alert(data.jsonElement); 
     //do something with your data HERE 

    } 

});

avec jsonElement étant un élément dans votre tableau JSON

Answer 4

Ce n'est pas une question de portée. C'est la nature asynchrone de votre appel Ajax. Votre fonction queryCostCenter retournera probablement avant que le gestionnaire Ajax success s'exécute. Vous devez lancer toute la logique post-Ajax dans votre rappel success.