CODEWITHSUNDEEP
javascriptphpjquerymysqljson
user2880254
user2880254

Reputation: 43

Access multiple objects/arrays in JSON in jQuery $.each

I am trying to build a simple page to view messages saved in a mysql db via JSON and jQuery.

My JSON IS

{"unread_msgs":[{"id":"6","title":"33333","user1":"19","timestamp":"1383747146","client_id":"Generic"},{"id":"5","title":"42142","user1":"19","timestamp":"1383740864","client_id":"Generic"}],"read_msgs":[{"id":"4","title":"test to addnrow","user1":"19","timestamp":"1383676647","client_id":"Generic"},{"id":"2","title":"kll","user1":"19","timestamp":"1383675548","client_id":"Generic"},{"id":"1","title":"jkjljklj","user1":"19","timestamp":"1382539982","client_id":"Generic"}],"urm_t":2,"rm_t":3}

My JS

<script type="text/javascript">
function GetClientMsgs () {
    $.post("assets/server/client_msgs.php",{ client_id:local_client_id } ,function(data)
    {           
        var MsgData = $.parseJSON(data);
        console.log("Msg json data parsed");

        $.each(MsgData, function(key, value)
        {
          console.log(value);
            $('#unread_row').append('<td><a href="#read_pm" onClick="ReadMsg('+value.unread_msgs.id+'); return false;">'+value.unread_msgs.title+'</a></td><td><a href="#profile">'+value.unread_msgs.studioname+'</a></td><td>'+value.unread_msgs.timestamp+'</td><td><a href="#delete_msg" onClick="DeleteMsg('value.unread_msgs.id+'); return false;">X</a></td>');

            $('#read_row').append('<td><a href="#read_pm" onClick="ReadMsg('+value.read_msgs.id+'); return false;">'+value.read_msgs.title+'</a></td><td><a href="#profile">'+value.read_msgs.studioname+'</a></td><td>'+value.read_msgs.timestamp+'</td><td><a href="#delete_msg" onClick="DeleteMsg('+value.read_msgs.id+'); return false;">X</a></td>');
        });
    });
}                   
</script>

PHP

$msgs = array('unread_msgs' => $dn1s, 'read_msgs' => $dn2s, 'urm_t' => $unread_msgs, 'rm_t' => $read_msgs);

$json = json_encode($msgs);

I am trying to post values returned such as unread_msgs.title or .id and am not able to access any of the objects. I have searched on here and could not find something specific to my structure. Thanks alot.

Upvotes: 0

Views: 5381

Answers (2)

Jacob
Jacob

Reputation: 1793

In this row:

$('#unread_row').append('<td><a href="#read_pm" onClick="ReadMsg('+value.unread_msgs.id+'); return false;">'+value.unread_msgs.title+'</a></td><td><a href="#profile">'+value.unread_msgs.studioname+'</a></td><td>'+value.unread_msgs.timestamp+'</td><td><a href="#delete_msg" onClick="DeleteMsg('value.unread_msgs.id+'); return false;">X</a></td>');

You are accessing the value variable as an object, while it is in fact an array.

To access the first unread message id within your $.each loop, you would do: value[0].id.

If you are trying to get a list of unread and read messages, try to loop over them.

$.each(MsgData.unread_msgs, function(index, message) {
    $('#unread_row').append('<td>' + message.id + '</td><td>.......');
});

$.each(MsgData.read_msgs, function(index, message) {
    $('#read_row').append('<td>' + message.id + '</td><td>.......');
});

Or with a nested loop:

$.each(MsgData, function(key, value) {
    $.each(value, function(index, message) {
        $('#' + key).append('<td>' + message.id + '</td><td>....);
    });
]);

Upvotes: 0

Josh Harrison
Josh Harrison

Reputation: 6004

I would loop over the unread and read results separately, like this:

    $.each(MsgData.unread_msgs, function(key, value)
    {
      // code append to unread row
      console.log(value.id, value.title, "etc");
    });

    $.each(MsgData.read_msgs, function(key, value)
    {
      // append to append to read row
      console.log(value.id, value.title, "etc");
    });

Pasting your json into a formatter such as http://jsonformatter.curiousconcept.com/ can help you to see its structure.

Upvotes: 1

Related Questions