не смог разобрать JSON с помощью JQuery после Ajax вызова

Question

это мой PHP скрипт

<?php 

$wishes_array["wishes_text"] = null; 
$wishes_array["total"] = null; 
$count = 0; 
// wishes has all records 
if(!is_null($wishes)) 
{ 
    foreach($wishes as $wish) 
    { 
     if($wish->text != null) 
     { 
      $wishes_array["wishes_text"][$count] = html_escape($wish->text); 
      $count++; 
     } 
    } 
    $wishes_array["total"] = sizeof($wishes); 
    echo json_encode($wishes_array); 
} 
?> 

фон

пользователь посылает свои пожелания с помощью кнопки, но у него есть возможность отправить какое-то сообщение с его желание, предположим, человек А просто послал пожелание, но человек В послал пожелание с текстом «С Днем Рождения», человек С послал пожелание с текстом «У меня отличный день рождения»

Теперь, используя этот массив, у нас есть массив, который сообщает total количество полученных пожеланий (с текстом и без текста) и wishes текст пожеланий, присланных человеком.

проблема

не смог использовать разобрать JSON с помощью JQuery, вот что я сделал, и вернуть undefined

var total_start = '<div style="padding: 3px;margin: 10px auto;"><i class="fa fa-heart" style="background: #e53935; color: #fff;padding: 5px;border-radius: 50%;"></i> '; 
var total_end = '</div>'; 
var startString = '<div style="padding: 3px;margin: 10px auto;"><i class="fa fa-heart" style="background: #e53935; color: #fff;padding: 5px;border-radius: 50%;"></i>'; 
var endSting = '</div>'; 
var wishes = ''; 
var count = 0; 
if(data["wishes_text"] != null){ 
    $.each(data, function(index, element) { 
     wishes += startString; 
     wishes += ' ' + data["wishes_text"][count]; 
     wishes += endSting; 
     count++; 
    }); 
} 
var total = ""; 
if(data["total"] == 1) 
{ 
    total = total_start + data["total"] + ' person wished' + total_end; 
} 
else 
{ 
    total = total_start + data["total"] + ' people wished' + total_end; 
} 
$('#wish_div').html(total + wishes); 

ответ Аякса JSon

{"wishes_text":["wish 1","wish 2"],"total":3}

Answer 1

Вопрос в ваш код просто состоит в том, что вы пытаетесь выполнить итерацию через data вместо массива wishes_text, содержащегося в пределах data. Обратите внимание, что вы также можете немного убрать логику. Попробуйте это:

var total = '<div style="padding: 3px;margin: 10px auto;"><i class="fa fa-heart" style="background: #e53935; color: #fff;padding: 5px;border-radius: 50%;"></i>' + data["total"] + ' ' + (data.total == 1 ? 'person' : 'people') + ' wished</div>'; 
var startString = '<div style="padding: 3px;margin: 10px auto;"><i class="fa fa-heart" style="background: #e53935; color: #fff;padding: 5px;border-radius: 50%;"></i>'; 
var endSting = '</div>'; 
var wishes = ''; 

if (data.wishes_text != null) { 
    $.each(data.wishes_text, function(index, element) { 
     wishes += startString + ' ' + data["wishes_text"][index] + endSting; 
    }); 
} 
$('#wish_div').html(total + wishes); 

Working example

Я также предлагаю вам посмотреть, чтобы с помощью таблиц стилей и классов над инлайн стайлинга, а также библиотека шаблонный как большие куски HTML в коде JS находятся на предел «слишком большой», с точки зрения лучшей практики.