Looping through a JSON array with jQuery

Question

I have my json array with is this :

[{"id":"1","cid":"1","da":"08:00:00","a":"12:00:00","data":"2011-07-03","persone":"3","nome":"Via Bligny"},

{"id":"8","cid":"1","da":"08:30:00","a":"14:45:00","data":"2011-09-26","persone":"2","nome":"Via Bligny"},

{"id":"9","cid":"1","da":"08:30:00","a":"14:15:00","data":"2011-09-26","persone":"2","nome":"Via Bligny"}]

And i want to print it in a table, for example,

<tr><td>{id}</td><td>{da}</td><td>{a}</td><td>{data}</td>(ecc)</tr>

a row for each data set, but, if i try with this code

function ore(cid){
        $.post('index.php?act=ore', {cid : 1}, function(data){
            $.each(data, function(i){
                document.write(data[i].id);
            });
        });
    }

for example, this is the output

undefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefined

Thank you.

Your code as shown will work Here's proof. Have you verified that data is giving you what you expect? — user1106925
– user1106925, Commented Jan 15, 2012 at 16:59
I'm guessing that you're not parsing the JSON first. See my answer below. — user1106925
– user1106925, Commented Jan 15, 2012 at 17:14
Iesm i didn't parse the JSON :) i was used to use getJSON so i didn't do it ): — Francesco Zaffaroni
– Francesco Zaffaroni, Commented Jan 15, 2012 at 17:40
Just a thought - mixing jQuery with document.write doesn't look like you know what you're doing. If this function gets called after the document is loaded it will destroy the page. You should use jQuery's .append or any other manipulation method — naugtur
– naugtur, Commented Jan 15, 2012 at 17:47

user1106925 · Accepted Answer · 2012-01-15 17:12:57Z

3

Your code as shown works fine.

Because of this, I'm assuming that you haven't parsed the JSON into JavaScript before looping.

var parsed = $.parseJSON( data );

So your code would be...

function ore(cid){
    $.post('index.php?act=ore', {cid : 1}, function(data){

           // parse it first
        var parsed = $.parseJSON( data );

        $.each(parsed, function(i,v){
            document.write(parsed[i].id);
     //     document.write(v); // or like this
        });
    });
}

Without parsing, you're just looping over the characters in the string, and none of them will have an id property.

answered Jan 15, 2012 at 17:12

user1106925

Sign up to request clarification or add additional context in comments.

Comments

Ariful Islam · Accepted Answer · 2012-01-15 16:53:17Z

0

function ore(cid){
        $.post('index.php?act=ore', {cid : 1}, function(data){
            $.each(data, function(key, value){
                document.write(value.id);
            });
        });
    }

answered Jan 15, 2012 at 16:53

Ariful Islam

7,6837 gold badges38 silver badges55 bronze badges

Comments

Kanishka Panamaldeniya · Accepted Answer · 2012-01-15 17:24:22Z

0

function ore(cid){
        $.post('index.php?act=ore', {cid : 1}, function(data){

var arr = $.parseJSON( data );

for(x in arr){

    alert(arr[x]['id']);
    alert(arr[x]['da']);
    alert(arr[x]['a']);
    alert(arr[x]['data']);
    alert(arr[x]['ecc']);
}

    });
}

answered Jan 15, 2012 at 17:24

Kanishka Panamaldeniya

17.6k31 gold badges128 silver badges195 bronze badges

1 Comment

Francesco Zaffaroni Over a year ago

Thank you ;) had to parse the json

gion_13 · Accepted Answer · 2012-01-15 17:38:17Z

0

You could and probably should use a templating system. You could use the one jQuery provides :

$.template("tableRowTemplate",'<tr><td>${id}</td><td>${da}</td><td>${a}</td><td>${data}</td>${ecc}</tr>');
function ore(cid){
    var result;
    $.post('index.php?act=ore', {cid : 1}, function(data){
        $.each(data, function(i,el){
            var row = ($.tmpl( "tableRowTemplate", el);
            if(!result)
                result = row;
            else
                result.add(row);
        });
    });
    // do what you want to do with result
}

answered Jan 15, 2012 at 17:38

gion_13

41.5k10 gold badges99 silver badges111 bronze badges

Comments

Ruslanas Balčiūnas · Accepted Answer · 2012-03-01 21:27:57Z

0

function ore(cid){
    $.postJSON('index.php?act=ore', {cid : 1}, function(data){
        for(var i in data) {
            document.write(data[i].id);
        };
    });
}

edited Mar 1, 2012 at 21:27

answered Jan 15, 2012 at 16:56

Ruslanas Balčiūnas

7,4563 gold badges27 silver badges42 bronze badges

1 Comment

Francesco Zaffaroni Over a year ago

i think i prefer parse the json;)

Collectives™ on Stack Overflow

Looping through a JSON array with jQuery

5 Answers 5

Comments

Comments

1 Comment

Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

5 Answers 5

Comments

Comments

1 Comment

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related