boucle jQuery sur JSON résultat d’AJAX Success?

Sur le rappel de succès jQuery AJAX, je veux effectuer une boucle sur les résultats de l’object. Ceci est un exemple de la façon dont la réponse ressemble à Firebug.

[ {"TEST1":45,"TEST2":23,"TEST3":"DATA1"}, {"TEST1":46,"TEST2":24,"TEST3":"DATA2"}, {"TEST1":47,"TEST2":25,"TEST3":"DATA3"} ] 

Comment passer en revue les résultats pour avoir access à chacun des éléments? J’ai essayé quelque chose comme ci-dessous mais cela ne semble pas fonctionner.

 jQuery.each(data, function(index, itemData) { // itemData.TEST1 // itemData.TEST2 // itemData.TEST3 }); 

vous pouvez supprimer la boucle externe et la remplacer par data.data :

 $.each(data.data, function(k, v) { /// do stuff }); 

Tu étais proche:

 $.each(data, function() { $.each(this, function(k, v) { /// do stuff }); }); 

Vous avez un tableau d’objects / de cartes pour que la boucle externe les répète. La boucle interne effectue une itération sur les propriétés de chaque élément object.

Vous pouvez aussi utiliser la fonction getJSON :

  $.getJSON('/your/script.php', function(data) { $.each(data, function(index) { alert(data[index].TEST1); alert(data[index].TEST2); }); }); 

Il ne s’agit là que d’une reformulation de la réponse d’ifesdjeen, mais j’ai pensé que cela pourrait être utile aux gens.

Si vous utilisez Fire Fox, ouvrez simplement une console (utilisez la touche F12) et essayez ceci:

 var a = [ {"TEST1":45,"TEST2":23,"TEST3":"DATA1"}, {"TEST1":46,"TEST2":24,"TEST3":"DATA2"}, {"TEST1":47,"TEST2":25,"TEST3":"DATA3"} ]; $.each (a, function (bb) { console.log (bb); console.log (a[bb]); console.log (a[bb].TEST1); }); 

J’espère que cela aide

Pour quiconque rest coincé avec cela, cela ne fonctionnera probablement pas car l’appel ajax interprète vos données renvoyées sous forme de texte, c’est-à-dire qu’il ne s’agit pas encore d’un object JSON.

Vous pouvez le convertir en object JSON en utilisant manuellement la commande parseJSON ou en ajoutant simplement la propriété dataType: ‘json’ à votre appel ajax. par exemple

 jQuery.ajax({ type: 'POST', url: '', data: data, dataType: 'json', // ** ensure you add this line ** success: function(data) { jQuery.each(data, function(index, item) { //now you can access properties using dot notation }); }, error: function(XMLHttpRequest, textStatus, errorThrown) { alert("some error"); } }); 

Accédez au tableau json comme vous le feriez avec tout autre tableau.

 for(var i =0;i < itemData.length-1;i++) { var item = itemData[i]; alert(item.Test1 + item.Test2 + item.Test3); } 

Vous pouvez également utiliser la fonction getJSON:

 $.getJSON('/your/script.php', function(data) { $.each(data, function(index) { alert(data[index].TEST1); alert(data[index].TEST2); }); }); 

Essayez la fonction jQuery.map , fonctionne plutôt bien avec les cartes.

 var mapArray = { "lastName": "Last Name cannot be null!", "email": "Email cannot be null!", "firstName": "First Name cannot be null!" }; $.map(mapArray, function(val, key) { alert("Value is :" + val); alert("key is :" + key); }); 
  

C’est ce que j’ai imaginé pour visualiser facilement toutes les valeurs de données:

 var dataItems = ""; $.each(data, function (index, itemData) { dataItems += index + ": " + itemData + "\n"; }); console.log(dataItems); 

$each fonctionnera .. Une autre option est jQuery Ajax Callback pour le résultat du tableau

 function displayResultForLog(result) { if (result.hasOwnProperty("d")) { result = result.d } if (result !== undefined && result != null ) { if (result.hasOwnProperty('length')) { if (result.length >= 1) { for (i = 0; i < result.length; i++) { var sentDate = result[i]; } } else { $(requiredTable).append('Length is 0'); } } else { $(requiredTable).append('Length is not available.'); } } else { $(requiredTable).append('Result is null.'); } } 

si vous ne voulez pas d’alerte, c’est que vous voulez du HTML, alors faites ceci

 ... $.each(data, function(index) { $("#pr_result").append(data[index].dbcolumn); }); ... 

NOTE: utilisez “append” et non “html” sinon le dernier résultat est ce que vous verrez sur votre vue HTML

alors votre code html devrait ressembler à ceci

 ... 
...

Vous pouvez également styler (append une classe) le div dans la jquery avant de le rendre en html