Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to decode JSON object and iterate over it?

In this post I learned how to encode an object on the server side, and now I would like to decode it on the client side.

On the client side I do

$.ajax({
    type: "GET",
    url: "/cgi-bin/ajax_sort.pl",
    contentType: "application/json; charset=utf-8",
    dataType: "json",

    data: { "column" : this.id },

    error: function(XMLHttpRequest, textStatus, errorThrown) {
        showError('responseText: ' + XMLHttpRequest.responseText);
        showError('textStatus: ' + textStatus);
        showError('errorThrown: ' + errorThrown);
    },

    success: function(result){
        if (result.error) {
            showError(result.error);
        } else {

        var obj = jQuery.parseJSON(result);

        }
    }
});

Question

Does obj now contain the decoded JSON data?

If so, the object looks like this one the server side (output from Perl's Data::Dumper)

$VAR1 = {
          '127' => {
                     'owners' => [
                                   'm'
                                 ],
                     'users' => [
                                  'hh',
                                  'do'
                                ],
                     'date_end' => '24/05-2011',
                     'title' => 'dfg',
                     'date_begin' => '24/05-2011',
                     'members_groups' => [],
                     'type' => 'individuel'
                   },
          '276' => {
                     ...

Question

Is obj indeed contains the decoded JSON, how do I iterate over the object?

like image 604
Sandra Schlichting Avatar asked Feb 24 '23 23:02

Sandra Schlichting


2 Answers

Because you specified the dataType: 'json', result should already contain the Javascript object unserialized from the HTTP response. $.parseJSON should be unnecessary.

You can loop through it with $.each:

success: function(result){
    if (result.error) {
        showError(result.error);
    } else {
        $.each(result, function(key, value) {
            alert(value.title).
        });
    }
}
like image 131
lonesomeday Avatar answered Feb 26 '23 12:02

lonesomeday


result is already a JSON object - parsed by jQuery since you've specified dataType: "json" - so you shouldn't be parsing it.

To go over the data, you could do this:

for(key in result){
    var curr = result[key];

    //iterate over owners    
     for(var i = 0; i < curr.owners.length; i++){
         alert(curr.owners[i]);
     }

    //iterate over users    
     for(var i = 0; i < curr.users.length; i++){
         alert(curr.users[i]);
     }

     alert(curr.data_end);
     alert(curr.title);

    //and so on...
}

Update

I keep forgetting about $.each() as shown in lonsomeday's answer - you might want to go with that instead.

like image 33
no.good.at.coding Avatar answered Feb 26 '23 11:02

no.good.at.coding