how to parse array from json returned from php

Question

I have an index.html file that calls main.php which returns a json object just fine.

main.php returns this

{
    "products": [
        {
            "id": "1",
            "txt": "Bar",
            "image": "",
            "page": ""
        },
        {
            "id": "2",
            "txt": "Car",
            "image": "",
            "page": ""
        },
        {
            "id": "3",
            "txt": "Far",
            "image": "",
            "page": ""
        }
    ],
    "success": 1
}

in Java there is json.getJSONArray(TAG_PRODUCTS);

but.... I am using HTML and javascript here... so in my html file I have the following how do I pull the products array out of my json returned data?

$.ajax({
    type: 'POST',
    dataType: 'json',
    url: 'http://localhost:8888/HelloWorld/main.php',
    contentType: "application/json; charset=utf-8",
    success: function (data) { 
        var names = data
        $('sa_content').append('<select name="input_4">');
        $.each(data, function(index, element) {

            alert( "index: " + index + ", element.cf_id: " + element );

        });
        $('sa_content').append('</select>');
    },
    error: function(){
        $('#sa_content').append('<li>There was an error loading the feed');
    }
});

When I run the index.html page I get the following alerts

index = products, element =  [object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]

and

index = success, element =  1

So how do I pull the products array out of the json and iterate through it to get the values of id, txt, image, page?

Thanks in advance for your time. Dean-O

KaeruCT · Accepted Answer · 2012-10-24 00:28:57Z

3

Try using this as the success function:

function (data) {
    var products = data.products;

    for (var i = 0; i < products.length; i++) {
        var product = products[i];
        alert(product.id + " " + product.txt + " " + product.image + " " + product.page);
    }
}

It should iterate through all the products and alert you the data. Then you can modify the code to suit your needs.

answered Oct 24, 2012 at 0:28

KaeruCT

1,65515 silver badges16 bronze badges

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

1 Comment

Dean-O Over a year ago

Excellent... thanks for clearing it up. Worked like a champ.

Sean Kinsey · Accepted Answer · 2012-10-24 00:28:15Z

0

You either use JSON.parse, or simply eval('(' + json + ')'); if you are certain the code is safe.

answered Oct 24, 2012 at 0:28

Sean Kinsey

38k7 gold badges55 silver badges71 bronze badges

Comments

Justin Helgerson · Accepted Answer · 2012-10-24 00:29:08Z

0

You're getting an array of products, so you want to iterate over that array:

success: function (data) { 
    var names = data

    for(i = 0; i < data.products.length; i++) {
        //Do what you want.
        var id = data.products[i].id;
    }
}

answered Oct 24, 2012 at 0:29

Justin Helgerson

25.7k19 gold badges104 silver badges128 bronze badges

Comments

Seth Battin · Accepted Answer · 2012-10-24 00:31:49Z

0

If your page returns ONLY json, then the XHR object that comes back from your jquery ajax should contain a javascript object constructed from that data. If that is not the case, something is wrong with your page, such as returning more than a json encoded string.

answered Oct 24, 2012 at 0:31

Seth Battin

2,86126 silver badges36 bronze badges

Collectives™ on Stack Overflow

how to parse array from json returned from php

4 Answers 4

1 Comment

Comments

Comments

Comments

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

1 Comment

Comments

Comments

Comments

Related