it-swarm.com.de

jQuery-Schleife über JSON-Ergebnis von AJAX Erfolg?

Beim jQuery AJAX Success Callback möchte ich die Ergebnisse des Objekts durchlaufen. Dies ist ein Beispiel dafür, wie die Antwort in Firebug aussieht.

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

Wie kann ich die Ergebnisse wiederholen, damit ich auf jedes der Elemente zugreifen kann? Ich habe etwas wie unten versucht, aber das scheint nicht zu funktionieren.

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

sie können die äußere Schleife entfernen und this durch data.data ersetzen:

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

Du warst nah:

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

Sie haben ein Array von Objekten/Karten, so dass die äußere Schleife diese wiederholt. Die innere Schleife durchläuft die Eigenschaften jedes Objektelements.

233
cletus

Sie können auch die Funktion getJSON verwenden:

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

Dies ist wirklich nur eine Umformulierung der Antwort von ifesdjeen, aber ich dachte, es könnte für die Leute hilfreich sein.

77
clone45

Wenn Sie Fire Fox verwenden, öffnen Sie einfach eine Konsole (verwenden Sie die Taste F12) und probieren Sie Folgendes aus:

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

ich hoffe es hilft

38
0100110010101

Für alle anderen, die sich daran halten, funktioniert es wahrscheinlich nicht, da der Ajax-Aufruf Ihre zurückgegebenen Daten als Text interpretiert - d. H. Es ist noch kein JSON-Objekt.

Sie können es in ein JSON-Objekt konvertieren, indem Sie den Befehl parseJSON manuell verwenden oder einfach die Eigenschaft 'dataType:' json 'zu Ihrem Ajax-Aufruf hinzufügen. z.B.

jQuery.ajax({
    type: 'POST',
    url: '<?php echo admin_url('admin-ajax.php'); ?>',
    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");
    }
});
14
Dave Hilditch

Greifen Sie wie jedes andere Array auf das Json-Array zu.

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

Sie können auch die getJSON-Funktion verwenden:

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

Dies ist, was ich mit auf die einfache Ansicht aller Datenwerte kam:

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

4
Yovav

Try jQuery.map funktioniert gut mit Karten.

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);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

4
PanwarS87

wenn Sie keine Benachrichtigung wünschen, dh Sie möchten HTML, dann tun Sie dies

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

HINWEIS: Verwenden Sie "append" und nicht "html". Andernfalls erhalten Sie in Ihrer HTML-Ansicht das letzte Ergebnis

dann sollte Ihr HTML-Code so aussehen

...
<div id="pr_result"></div>
...

Sie können das div in der Jquery auch formatieren (hinzufügen), bevor es als HTML-Format dargestellt wird

2
The Dead Guy

$each wird funktionieren .. Eine andere Option ist jQuery Ajax Callback für Array-Ergebnis

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.');
    }
  }
0
Lijo

Ich benutze .map für foreach. Zum Beispiel

success:function(data){
      let dataItems = JSON.parse(data)
      dataItems = dataItems.map((item) => {
        return $(`<article>
                      <h2>${item.post_title}</h2>
                      <p>${item.post_excerpt}</p>
              </article>`)
      })
    },
0
dimitar

Ich bin an der Pfeilfunktion ES2015 zum Auffinden von Werten in einem Array beteiligt

const result = data.find(x=> x.TEST1 === '46');

Checkout Array.prototype.find () HERE

0

Wenn Sie die im Folgenden gezeigte Kurzmethode der JQuery-Ajax-Aufruffunktion verwenden, müssen die zurückgegebenen Daten als JSON-Objekt interpretiert werden, damit Sie eine Schleife durchführen können.

$.get('url', function(data, statusText, xheader){
 // your code within the success callback
  var data = $.parseJSON(data);
  $.each(data, function(i){
         console.log(data[i]);
      })
})
0
Frederick Eze