loop a recieved json string to get values by jquery

Question

I'm trying to parse data returned from $.post().

[{"id":"1","text":"USD"},
 {"id":"2","text":"CNY"},
 {"id":"3","text":"PHP"},
 {"id":"4","text":"AUD"},
 {"id":"5","text":"SGD"},
 {"id":"6","text":"JPY"}]

using this approach Jquery, looping over a json array

I did something like this:

$.post(
    base_url+'cgame/currency',
    { gameID: gameID },
    function(data) {
        $(this).html();
        $.each(data,function(idx, obj) {
            $(obj).each(function(key, value) {
                console.log(key + ": " + value);
            });
        });
    }
);

but it gives me the error:

Uncaught TypeError: Cannot use 'in' operator to search for '120' in [{"id":"2","text":"CNY"},{"id":"3","text":"PHP"},{"id":"4","text":"AUD"},{"id":"5","text":"SGD"},{"id":"6","text":"JPY"}]

I also tried:

$.post(
    base_url+'cgame/currency',
    { gameID: gameID },
    function(data) {
        $(this).html();
        $(data).each(function(idx, obj) {
            $(obj).each(function(key, value) {
                console.log(key + ": " + value);
            });
        });
    }
);

but it also gives me the error:

Uncaught Error: Syntax error, unrecognized expression: [{"id":"1","text":"USD"},{"id":"6","text":"JPY"}]

How should I be doing this?

I guess you need to parse the JSON-string (data) to a JSON object before you iterate over it. Try JSON.parse(data) and iterate over that instead. — , Oct 21 '13 at 07:44

Prabhat Jain · Answer 1 · 2013-10-21T08:09:45.730

2

Your data comes in the form of array so you need to loop through each index and then fetch the values. So you can replace this :-

 $(obj).each(function(key, value) {
     console.log(key + ": " + value);
 });

with :-

 $.each( obj, function( key) {
     console.log( obj[key].id + ':' + obj[key].text);
 });

or you can do this :-

 $.each( obj, function( key, value ) {
     console.log( value.id + ':' + value.text);
 });

key is the index of array. It will return 0,1,2..

edited Oct 21 '13 at 08:09

answered Oct 21 '13 at 08:04

Prabhat Jain

346
1
8

yeah, thanks.. your second answer was also the thing i've found out from eggward and fibbe suggestions. – Vainglory07 Oct 21 '13 at 08:10

score 1 · Answer 2 · answered Oct 21 '13 at 07:46

1

I think the argument passed to your success callback function is of type string. Change it to:

 function(data) {
var parsedData = JSON.parse(data);
    $(this).html();
    $.each(parsedData ,function(idx, obj) {
        $(obj).each(function(key, value) {
            console.log(key + ": " + value);
        });
    });
}

answered Oct 21 '13 at 07:46

eggward

345
1
5

thank you for your effort :D ive already found the answer based on yours and the comment above my post. – Vainglory07 Oct 21 '13 at 07:53
1

this gives the output of 0: [object Object] grid.js:159 0: [object Object] grid.js:159 0: [object Object] grid.js:159 0: [object Object] grid.js:159 0: [object Object] grid.js:159 0: [object Object]. There is no error bu still values are not cuaght properly. So what i did is to remove the second loop of your code. – Vainglory07 Oct 21 '13 at 07:57

Vainglory07 · Accepted Answer · 2013-10-21T08:08:55.570

1

 function(data) {
    var value = JSON.parse(data);
    $.each(value ,function(idx, obj) {
       console.log("id : "+obj.id+" "+text:"+obj.text);
    });
 }

edited Oct 21 '13 at 08:08

answered Oct 21 '13 at 07:58

Vainglory07

5,073
10
43
77

bipen · Answer 4 · 2013-10-21T07:52:12.377

0

try this

$.post(base_url+'cgame/currency',{ gameID: gameID },
 function(data) {
    $(this).html(); //<-- becareful $(this) might not be the element you think it is
    $.each(data,function(idx, obj) {
        console.log( "id : " + obj.id);
        console.log( "text: " + obj.text);
   });
 },'JSON');

edited Oct 21 '13 at 07:52

answered Oct 21 '13 at 07:43

bipen

36,319
9
49
62

im sorry but still gives the second error on my post.but thanks for the help :D – Vainglory07 Oct 21 '13 at 07:52

loop a recieved json string to get values by jquery

4 Answers4

Linked