JQuery, Ajax, Json, PHP multidimensional associative array

Question

I am trying to loop through a multidimensional associative array retrieved via jquery/ajax from a php file. The php array looks like this:

$pink =  array ( "newarray" => array 
( "varietyOne" => array
("name" => "Poublout", "year" => 2002),
"varietyTwo" => array
("name" => "Gerarde", "year" => 2003),
"varietyThree" => array
("name" => "Encore", "year" => 1956),
"varietyFour" => array
("name" => "Toujours", "year" => 1957),
"varietyFive" => array
("name" => "J'aime", "year" => 1958),
"varietySix" => array
("name" => "Alisee", "year" => 2001)
),
"varNumber" => array
("varietyOne",
"varietyTwo",
"varietyThree",
"varietyFour",
"varietyFive",
"varietySix"
)
);
print json_encode($pink);

The js looks like this:

$(document).ready(function () {
    $('.clicker').click(function () {
        $.ajax({
            type: 'GET',
            url: 'another.php',
            dataType: 'json',
            success: function (brandon) {
                for (var i = 0; i < brandon.newarray.length; i++) {
                    var catName = brandon.varNumber[i];
                    for (var wineName in brandon.newarray[i][catName]) {
                        console.log(branond.newarray[i][catName][wineName]);
                    }
                }
            }
        });
    });
});

And here is the json rather than the php:

{"newarray":
    {"varietyOne":{"name":"Poublout","year":2002},
     "varietyTwo":{"name":"Gerarde","year":2003},
     "varietyThree":{"name":"Encore","year":1956},
     "varietyFour":{"name":"Toujours","year":1957},
     "varietyFive":{"name":"J'aime","year":1958},
     "varietySix":{"name":"Alisee","year":2001}},
 "varNumber":
    ["varietyOne","varietyTwo","varietyThree","varietyFour","varietyFive","varietySix"]}

I've tried several different loops, changing my array values, but I can't make anything work. I can call an individual key=value pair in the array, but I can't get it to loop through all values.
Thank you.

And the results of console.log(brandon)

Object { newarray={...}, varNumber=[6]}
newarray
Object { varietyOne={...}, varietyTwo={...}, varietyThree={...}, more...}
varietyFive
Object { name="J'aime", year=1958}
varietyFour
Object { name="Toujours", year=1957}
varietyOne
Object { name="Poublout", year=2002}
varietySix
Object { name="Alisee", year=2001}
varietyThree
Object { name="Encore", year=1956}
varietyTwo
Object { name="Gerarde", year=2003}
varNumber
["varietyOne", "varietyTwo", "varietyThree", 3 more...]
0   "varietyOne"
1   "varietyTwo"
2   "varietyThree"
3   "varietyFour"
4   "varietyFive"
5   "varietySix"

So, the loop now outputs to console, but I want the text to be displayed on my site. Normally I use a $('#somediv').append(brandon.(whateverelse); and the information will appear. In this case it does not.

You should add header('Content-type: application/json'); to your PHP, although this probably has no impact on your current problem. — Hamza Kubba
– Hamza Kubba, Commented Oct 14, 2013 at 18:56
Can you add in the json rather than the php which generates the json? — James Montagne
– James Montagne, Commented Oct 14, 2013 at 18:58
Doesn't matter at what point you add it, header() is applied to the beginning of the response regardless. — Hamza Kubba
– Hamza Kubba, Commented Oct 14, 2013 at 18:59

Hamza Kubba · Accepted Answer · 2013-10-14 19:05:32Z

1

You shouldn't need the varNumber array.

All you need is:

for (var index in brandon.newarray) {
    console.log(index);
    console.log(brandon.newarray[index]);
    console.log(brandon.newarray[index]['name']); // or brandon.newarray[index].name
    console.log(brandon.newarray[index]['year']); // or brandon.newarray[index].year
}

In this case, index will be varietyOne, varietyTwo, etc.

answered Oct 14, 2013 at 19:05

Hamza Kubba

2,26715 silver badges12 bronze badges

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

5 Comments

Jimmy Long Over a year ago

Ok, cool, but now how do I actually get it to output to my html, in an empty div? Normally I use $('#emptydiv').append(brandon); But this method does not work for me now.

Hamza Kubba Over a year ago

I see you updated the question with what you want to output (sorta). Anyway, there's a million ways to output results from a table... here's one example, a one-liner:

for (var index in brandon.newarray) $('#somediv').append('<div>' + brandon.newarray[index]['name'] + ': ' + brandon.newarray[index]['year'] + '</div>');

Jimmy Long Over a year ago

Yes, sorry, had a bit of connectivity issue. It works very well. Thank you much. Does that mean I can't simply append the whole function/object/array? I have to call an individual index=key within the array?

Hamza Kubba Over a year ago

Well, you can do many things. For example, you can write a function that takes an array and prints one row of data, then call that function from your loop: for (var index in brandon.newarray) displayRow(brandon.newarray[index]); Your question is a bit vague though I must say...

Jimmy Long Over a year ago

Ok, sorry for the vagueness. Thanks for answering! I think that will be all for now.

Collectives™ on Stack Overflow

JQuery, Ajax, Json, PHP multidimensional associative array

1 Answer 1

5 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

5 Comments

Your Answer

Sign up or log in

Post as a guest

Related