jQuery loop sobre el resultado JSON de AJAX Success?

En la callback exitosa de jQuery AJAX, quiero recorrer los resultados del objeto. Este es un ejemplo de cómo se ve la respuesta en Firebug.

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

¿Cómo puedo recorrer los resultados para tener acceso a cada uno de los elementos? He intentado algo como a continuación, pero esto no parece estar funcionando.

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

puede eliminar el bucle externo y reemplazarlo por data.data :

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

Estabas cerca:

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

Tienes una matriz de objetos / mapas para que el ciclo externo itere sobre ellos. El ciclo interno itera sobre las propiedades de cada elemento de objeto.

También puede usar la función getJSON :

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

Esto es solo una nueva redacción de la respuesta de ifesdjeen, pero pensé que podría ser útil para las personas.

Si usa Fire Fox, abra una consola (use la tecla F12) y pruebe esto:

 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); }); 

Espero eso ayude

Para cualquier otra persona atascada en esto, probablemente no funcione porque la llamada ajax interpreta los datos devueltos como texto, es decir, aún no es un objeto JSON.

Puede convertirlo a un objeto JSON usando manualmente el comando parseJSON o simplemente agregando la propiedad dataType: ‘json’ a su llamada ajax. p.ej

 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"); } }); 

Acceda a la matriz json como lo haría con cualquier otra matriz.

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

También puede usar la función getJSON:

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

Prueba la función jQuery.map , funciona bastante bien con los mapas.

 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); }); 
  

Esto es lo que se me ocurrió para ver fácilmente todos los valores de datos:

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

$each funcionará .. Otra opción es jQuery Ajax Callback for array result

 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 no quieres una alerta, quieres html, entonces haz esto

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

NOTA: use “append” no “html”, de lo contrario, el último resultado es lo que verá en su vista html

entonces tu código html debería verse así

 ... 
...

También puede aplicar estilo (agregar clase) al div en el jquery antes de representarlo como html