undefined error when iterating over json list

Question

hello guys, i got this code that keep on returning undefined msg instead of the expected html. Purpose of function: the purpose of the below function is to return notifications in away similar to fb one's. the code is working fine. but there's something wrong with the getJSON part that i couldn't figure out. so instead of returning "clonex1 likes your post" i get undefined. the code

function buzzme()
{
jQuery('#cnumber').removeClass();
jQuery('#cnumber').empty();

jQuery('#floating_box').toggle();

 var nHeader = '<div id="floating_box" class="fb">' +
'<div id="header"><span id="htext">Notifications</span></div>' +
'<div id="int">' +
'<div id="bodyx">' +
'<ul>';
var nFooter = '</ul>' +
'<div class="jfooter">' +
'<a href="#" id="seemore">See all notifications</a>' +
'</div>' +
'</div>' +
'</div>' +
'</div>';
var nContent;

jQuery.getJSON('notifications.php', {'n':1,'dht':3692}, function(response){
    jQuery.each(response, function(i, nt2){
        nContent += '<a href="#"><li id="lix">sdfsdfsd'+nt2.img+' '+nt2.notifier+'</li></a>';

    })

});

alert(nContent);
var nFinal = nHeader+nContent+nFooter;
if (!jQuery('#floating_box').length) {
  jQuery('body').append(nFinal);
}
}

notifications.php - setUpFlayout(); and setUpJSONList()

    function setUpFlyout() {
    $notify = new se_notify();
    $data2 = $notify->notify_summary();
    $trk = 0;

    if($data2['total'] >= 1) {
    for($i = 0; $ $i <= $data2['total']; $i++) {
$nid = $data2['notifys'][$i]['notify_id'];
$im = $data2['notifys'][$i]['notify_icon'];
$img = "<img src='./images/icons/$im' />";
$notifier = $data2['notifys'][$i]['notify_text'][0];
$atype = $data2['notifys'][$i]['notifytype_id'];
$url = '';
$url2 = $data2['notifys'][$i]['notify_url'];
if($atype == 1) {
  $url = ' has sent you friend <a href='.$url2.'>request</a>';  
}
$trk++;    
if($data2['total'] >= 2) {
    $ret_arr = '';
     if($i == 0) {
         $ret_arr = '[';
     }
     $ret_arr = $ret_arr.setUpJSONList($data2['total'], $nid, $img, $notifier, $url, $trk);
     if($i == $data2['total']-1) {
         $ret_arr = $ret_arr.']';
     }
    echo ''; 
} else if($data2['total'] == 1){
   //$ret_arr = '[{"dh3":"'.$data2['total'].'","nid":"'.$nid.'", "img":"'.$img.'","notifier":"'.$notifier.'","url":"'.$url.'"}]';
   $ret_arr = '';
   echo $ret_arr;
}
    if($i == ($data2['total']-1))
        break;
        }
    }
}

setUpJSONList();

function setUpJSONList($total, $nid, $img, $notifier, $url, $track) {
    $comma = ',';
    $lp = '';
    $rp = ']';
    $result = '';
    if($track == $total) {
    $result = '{"pos":"'.$track.'","dh3":"'.$total.'","nid":"'.$nid.'","img":"'.$img.'","notifier":"'.$notifier.'", "url":"'.$url.'"}';
    } else {
        $result = '{"pos":"'.$track.'","dh3":"'.$total.'","nid":"'.$nid.'","img":"'.$img.'","notifier":"'.$notifier.'", "url":"'.$url.'"},';    
    }
    return $result;
}

thanks

Answer 1

Your usage of nContent after getJSON might be undefined since getJSON is asynchronous and would not have completed initializing nContent. You need to move the code using nContent inside the callback of getJSON.

jQuery.getJSON('notifications.php', {'n':1,'dht':3692}, function(response){
    jQuery.each(response, function(i, nt2){
        nContent += '<a href="#"><li id="lix">sdfsdfsd'+nt2.img+' '+nt2.notifier+'</li></a>';

    })
    alert(nContent);
var nFinal = nHeader+nContent+nFooter;
if (!jQuery('#floating_box').length) {
  jQuery('body').append(nFinal);
}
});