jQuery: как перебирать JSON-кодированную строку (массив)
Я новичок в jQuery и надеюсь, что кто-нибудь может помочь мне с этим, а также дать мне некоторые объяснения.
У меня есть вызов Ajax, который возвращает строку в кодировке JSON с двумя значениями для каждого элемента, Itemid и itemVal — пример выглядит следующим образом (с помощью console.log):
Результат console.log (data):
string(225) "[{"itemID":1,"itemVal":"China"},{"itemID":2,"itemVal":"France"},{"itemID":3,"itemVal":"Germany"},{"itemID":4,"itemVal":"Italy"},{"itemID":5,"itemVal":"Poland"},{"itemID":6,"itemVal":"Russia"},{"itemID":7,"itemVal":"USA"},...]"Количество элементов здесь варьируется, но если в нем указан идентификатор элемента, то всегда существует соответствующий itemVal.
itemID — уникальное целое число, itemVal — простой текст.
Пока все работает, но вот моя проблема:
Для каждого itemID здесь я должен сделать что-то с соответствующим itemVal, например скажем просто войдите в консоль или предупредите об этом для тестирования.
Я знаю, что есть разные подходы к этому, как jQuery.each, $.each, for, foreach и т.д., но так как я только начал недавно, я не уверен, как я могу повторить это, соответственно. как я могу выбрать отдельные itemID из него.
Я пробовал разные подходы, в т.ч. $.parseJSON(data) что не удалось, и, кажется, проблема в том, что мой ввод перед декодированием двумерный массив вместо одномерного (Я надеюсь, что я использую правильные термины здесь), что заставило их либо возвращать ошибку, либо предупреждать каждый отдельный символ моей строки.
Обновление — неудачный пример согласно ответу ниже
$.ajax({
type: "post",
url: "ajax.php",
cache: "false",
data: {
node: 'fetchCountries',
itemIDs: itemIDs // a list of integers
},
success: function(data){
console.log(data);
var arr = JSON.parse(data);
$.each($(arr),function(key,value){
console.log(value.itemVal);
});
}
});
Обновление 2 — Мой PHP:
case "fetchCountries":
$intval_itemIDs = array_map("intval", $_POST["itemIDs"]);
$itemIDs = implode(",", $intval_itemIDs);
$stmt = $conn->prepare("SELECT itemID, en FROM Countries WHERE itemID IN(" . $itemIDs . ") ORDER BY itemID");
$stmt->execute();
$result = $stmt->get_result();
while($arrCountries = $result->fetch_assoc()){
$countries[] = array("itemID" => $arrCountries["itemID"], "itemVal" => $arrCountries["en"]);
}
var_dump(json_encode($countries));
break;
Ожидаемый результат (для тестирования):
console.log("China");
console.log("France");
console.log("Germany");
// ...
Может кто-то помочь мне с этим ?
Большое спасибо,
Тим
Решение
У вас есть строка JSON, представляющая массив, который вы анализируете в фактический Array, Затем вы перебираете массив, помещая каждый элемент в новый массив (arr).
Возможно, есть некоторая путаница. С надеждой этот пролить немного света.
// Considering the following JSON string:
var data = '[{"itemID":1,"itemVal":"China"},{"itemID":2,"itemVal":"France"},{"itemID":3,"itemVal":"Germany"},{"itemID":4,"itemVal":"Italy"},{"itemID":5,"itemVal":"Poland"},{"itemID":6,"itemVal":"Russia"},{"itemID":7,"itemVal":"USA"}]';
// You can create an Array from this like so:
var theArray = JSON.parse(data);
// Now you have an array with each item being an `object`
// with an "itemId" and an "itemVal". You can loop through
// this array and look at each object like so:
theArray.forEach(function (obj) {
console.log(obj.itemID + ': ' + obj.itemVal);
});
Другие решения
WhistleBlower, я проверил ваш код в моем браузере. Это сработало. Почему бы вам не использовать заголовок («Content-type: application / json»); тоже. Таким образом, вам не придется анализировать строку JSON.
var data = '[{"itemID":1,"itemVal":"China"},{"itemID":2,"itemVal":"France"},{"itemID":3,"itemVal":"Germany"},{"itemID":4,"itemVal":"Italy"},{"itemID":5,"itemVal":"Poland"},{"itemID":6,"itemVal":"Russia"},{"itemID":7,"itemVal":"USA"}]';
var arr = JSON.parse(data);
$.each($(arr),function(key,value){
console.log(value.itemVal);
});
Так просто, как это!
$.each($(data),function(key,value){
console.log(value.itemVal); //place alert if you want instead of console.log
});
перебрать полученный результат и получить itemVal ценность каждого item
ОБНОВИТЬ
добавлять dataType вариант вашего ajax и тип возврата из php должно быть json и я надеюсь, что вы делаете это!
$.ajax({
type: "POST",
url: "ajax.php",
cache: "false",
dataType:'json', //Add this
data: {
node: 'fetchCountries',
itemIDs: itemIDs // a list of integers
},
success: function(data){
console.log(data);
var arr = JSON.parse(data);
$.each($(arr),function(key,value){
console.log(value.itemVal);
});
}
});
и вернись из своего php должно быть echo json_encode(result);
Вы не анализируете строку, вы анализируете уже проанализированный объект
просто используйте его напрямую
var data=[{"itemID":1,"itemVal":"China"},{"itemID":2,"itemVal":"France"},{"itemID":3,"itemVal":"Germany"},{"itemID":4,"itemVal":"Italy"},{"itemID":5,"itemVal":"Poland"},{"itemID":6,"itemVal":"Russia"},{"itemID":7,"itemVal":"USA"}];
$.each(data,function(key,value){
console.log(value.itemVal);
});
или же/
var arr = JSON.parse(JSON.stringify(data));
$.each(arr, function (key, value) {
console.log(value.itemVal);
});
Обновление 1:
Я так думаю твой php файл вроде
<?php
$array = array( array( 'itemID' => 1, 'itemVal' => 'India'), array( 'itemID' => 2, 'itemVal' => 'usa'), array( 'itemID' => 3, 'itemVal' => 'china'), array( 'itemID' => 4, 'itemVal' => 'uk'));
echo json_encode($array);
//[{"itemID":1,"itemVal":"India"},{"itemID":2,"itemVal":"usa"},{"itemID":3,"itemVal":"china"},{"itemID":4,"itemVal":"uk"}]
?>
ваш сценарий должен быть
$.getJSON( "your.php", function( data ) {
console.log(data);
$.each(data, function (key, value) {
console.log(value.itemVal);
});
});
ИЛИ ЖЕ
$.ajax({
type: "post",
url: "your.php",
cache: "false",
dataType: 'json',
data: {
node: 'fetchCountries',
itemIDs: youval // a list of integers
},
success: function(data){
console.log(data);
var arr = JSON.parse(JSON.stringify(data));
$.each($(arr),function(key,value){
console.log(value.itemVal);
});
}
});
ИЛИ ЖЕ
$.ajax({
type: "post",
url: "your.php",
cache: "false",
dataType: 'json',
data: {
node: 'fetchCountries',
itemIDs: youval // a list of integers
},
success: function(data){
console.log(data);
$.each($(data),function(key,value){
console.log(value.itemVal);
});
}
});
Спасибо всем за помощь в этом.
Так как все другие подходы имели смысл для меня, но все же потерпели неудачу, я провел еще несколько исследований по этому вопросу и, наконец, выяснил, что стало причиной этого.
Проблема действительно была на стороне PHP и принял ответ на следующий пост сделал свое дело — так как я добавил это в свой PHP, все остальное на стороне JS работает нормально, и мне даже не нужен dataType: «JSON» там:
тип данных: "JSON" не будет работать
Согласно этому посту, решение для моего случая следующее: слава Йовану Перовичу:
<?php
//at the very beginning start output buffereing
ob_start();
// do your logic here
// right before outputting the JSON, clear the buffer.
ob_end_clean();
// now print
echo json_encode(array("id" => $realid, "un" => $username, "date" => $date));
?>
Еще раз спасибо.