jQuery: parse JSON into arrays of elements

Question

I have the following code, the first part of which gets JSON from PHP after a drop down selection is triggered. The result is placed in a div called "results" just to verify that it works. Everything looks good up to that point. I also have a couple lines of code which parse the JSON, and display the individual elements in a sequence of alerts, again, just to verify that it functions up to this point, which it does. However, after this, I try to parse the JSON in a similar manner as in creating the alerts, only place the individual results in separate arrays. I have a check to alert the results as the $.each is executed, so that I can see if the code block is functioning. However, it does not work. I am guessing that perhaps my brackets are not setup properly, or perhaps I need to declare another function somewhere. Can anyone suggest what might be the problem?

Thanks for your help.

$(document).ready(function() {

    $('#routesDropDown').change(function() {   
        var queryParam = 'routesStations=' +$(this).val();
        $.post('getstations.php', queryParam, processResponse);

    });

    function processResponse(data) {
    $('#results').html(data);   

// parse the data and store in variable, "obj"
var obj  = jQuery.parseJSON( data );
// iterate through each value in the "obj" variable
$.each(obj, function(key, value) {
    alert(value.color + ' ' + value.abbr + ' ' + value.lat + ' ' + value.lng);
});

        //THIS IS THE PART THAT DOES NOT WORK...
    var obj = jQuery.parseJSON( data ) {
        var color = [];
        var abbr = [];
        var lat = [];
        var lng = [];
        $.each(obj, function(value) {
            color.push(value.color);
            abbr.push(value.abbr);
            lat.push(value.lat);
            lng.push(value.lng);
            alert(value.color + ' ' + value.abbr + ' ' + value.lat + ' ' + value.lng);      
    })};

});

show me the structure of JSON string data

xkeshav
– xkeshav

2012-07-31 04:22:58 +00:00
Commented Jul 31, 2012 at 4:22 — xkeshav
– xkeshav, Commented Jul 31, 2012 at 4:22

stensonb · Accepted Answer · 2012-07-31 04:25:31Z

1

For me, the secret to jquery is the selectors...

I'd do a quick "alert(data)" before your $.each() function, just to be sure you're getting what you think you're getting...

answered Jul 31, 2012 at 4:25

stensonb

717 bronze badges

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

Comments

Nick · Accepted Answer · 2012-07-31 04:39:41Z

1

I think that callback function accepts two values index and value

So the code should be

$.each(obj, function(index, value) {<--- Here i have added index. Like your above code.
        color.push(value.color);
        abbr.push(value.abbr);
        lat.push(value.lat);
        lng.push(value.lng);
        alert(value.color + ' ' + value.abbr + ' ' + value.lat + ' ' + value.lng);      
})

answered Jul 31, 2012 at 4:39

Nick

1,8693 gold badges24 silver badges33 bronze badges

Comments

Rohan Kumar · Accepted Answer · 2012-07-31 04:40:14Z

0

I think your json is not created you can check it in console, if the code is not returning a json then you should pass a json parameter in the $.post function like

$.post('getstations.php', queryParam, processResponse,"json");

See the documentation here: jQueryPost

edited Jul 31, 2012 at 4:40

answered Jul 31, 2012 at 4:31

Rohan Kumar

40.7k11 gold badges81 silver badges111 bronze badges

1 Comment

Bob Mac Over a year ago

Hi Rohan, Thanks for your repsonse. Just to double check, I did an alert(), and am able to parse the json. It appears the json is indeed there, and I'm able to separate out the elements. However, I am not able to pass the elements into the arrays with the push statements. I'm now wondering whether I should try a for loop. I think I'll give that a try. Feel free to offer any other suggestions. Thanks again.

GDP · Accepted Answer · 2012-07-31 18:13:01Z

0

$.post('getstations.php', queryParam, processResponse,"json");
queryParam你现在是一个字符串不是一个object对象 jquery api文档说明这里是需要传入一个{xxx:xxx}对象

edited Jul 31, 2012 at 18:13

GDP

8,1636 gold badges48 silver badges84 bronze badges

answered Jul 31, 2012 at 5:10

ssvfdn

1

1 Comment

Bob Mac Over a year ago

Good observation: a json element is indeed a string, not an object. Thank you for your help.

Collectives™ on Stack Overflow

jQuery: parse JSON into arrays of elements

4 Answers 4

Comments

Comments

1 Comment

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

Comments

Comments

1 Comment

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related