Sending multidimensional array from jQuery to php

Question

I am passing an array from jQuery to php.

The array is generated from a table with this code:

    var stitchChartArray = [];
    var row = 0;

    // turn stitch chart into array for php
    $('#stitchChart').find('tr').each(function (index, obj) {

        //first row is table head- "Block #"
        if(index != 0){
            stitchChartArray.push([]);
            var TDs = $(this).children();
            $.each(TDs, function (i, o) {
                var cellData = [$(this).css('background-color'), $(this).find("img").attr('src')];
                stitchChartArray[row].push(cellData);
            });
            row++;
        }

    });

In console it looks like this:

[[["rgb(75, 90, 60)", "symbols/177.png"], ["rgb(75, 75, 60)", "symbols/184.png"], ["rgb(75, 90, 60)", "symbols/177.png"], 7 more...], [["rgb(105, 105, 105)", "symbols/163.png"], ["rgb(75, 75, 60)", "symbols/184.png"], ["rgb(75, 90, 60)", "symbols/177.png"], 7 more...], [["rgb(105, 105, 105)", "symbols/163.png"], ["rgb(75, 90, 60)", "symbols/177.png"], ["rgb(75, 75, 60)", "symbols/184.png"], 7 more...], [["rgb(75, 90, 60)", "symbols/177.png"], ["rgb(75, 90, 60)", "symbols/177.png"], ["rgb(98, 119, 57)", "symbols/210.png"], 7 more...], [["rgb(105, 105, 105)", "symbols/163.png"], ["rgb(105, 105, 105)", "symbols/163.png"], ["rgb(150, 150, 195)", "symbols/72.png"], 7 more...], [["rgb(75, 165, 105)", "symbols/187.png"], ["rgb(134, 158, 134)", "symbols/64.png"], ["rgb(165, 180, 180)", "symbols/171.png"], 7 more...], [["rgb(60, 150, 75)", "symbols/189.png"], ["rgb(120, 120, 90)", "symbols/225.png"], ["rgb(143, 163, 89)", "symbols/209.png"], 7 more...]]

It represents each row of a table->each cell of row->[0]rgb value of bg of cell [1]icon in cell.

This jQuery code returns the correct element(and rgb value) from the array:

alert(stitchChartArray[1][1][0]); //row 1,cell 1, first value(rgb)

But when it gets sent to the php script with this:

$.post('makeChartPackage.php', {'stitchChart[]': stitchChartArray }, function(data){
        alert(data);
    });

The php throws an error:

Cannot use string offset as an array in /Users/tnt/Sites/cross_stitch/makeChartPackage.php on line 33

$stitchChart = $_POST['stitchChart']; 
echo $stitchChart[1][1][0]; //line 33

I am assuming I am either constructing the array incorrectly or passing it to the php script incorrectly.

EDIT: I did this to return the array to jQuery:

$stitchChart = $_POST['stitchChart'];
print_r($stitchChart);

And here was the result: Array ( [0] => rgb(75, 90, 60),symbols/177.png,rgb(75, 75, 60),symbols/184.png,rgb(75, 90, 60),symbols/177.png,rgb(98, 119, 57),symbols/210.png,rgb(180, 195, 105),symbols/388.png,rgb(165, 165, 120),symbols/235.png,rgb(75, 75, 60),symbols/184.png,rgb(90, 90, 45),symbols/195.png,rgb(120, 120, 75),symbols/156.png,rgb(105, 105, 105),symbols/163.png [1] => rgb(105, 105, 105),symbols/163.png,rgb(75, 75, 60),symbols/184.png,rgb(75, 90, 60),symbols/177.png,rgb(75, 90, 60),symbols/177.png,rgb(165, 165, 120),symbols/235.png,rgb(120, 120, 75),symbols/156.png,rgb(75, 90, 60),symbols/177.png,rgb(75, 90, 60),symbols/177.png,rgb(105, 105, 105),symbols/163.png,rgb(120, 120, 90),symbols/225.png [2] => rgb(105, 105, 105),symbols/163.png,rgb(75, 90, 60),symbols/177.png,rgb(75, 75, 60),symbols/184.png,rgb(75, 90, 60),symbols/177.png,rgb(98, 119, 57),symbols/210.png,rgb(75, 90, 60),symbols/177.png,rgb(75, 75, 60),symbols/184.png,rgb(105, 105, 105),symbols/163.png,rgb(120, 120, 90),symbols/225.png,rgb(105, 105, 105),symbols/163.png

It appears the array is not multidimensional?

DaveRandom · Accepted Answer · 2012-01-02 15:14:36Z

1

$_POST['stitchChart'] in the context you have addressed it there is (effectively) a JSON representation of a multidimensional array, stored as a string. When you treat a string as a multidimensional indexed array in PHP, you will get that error. The first [x] is treated as a "string offset" - i.e. the character at position x - but the next and any subsequent [x] addresses can only be treated as arrays (you cannot get a substring of a single character) and will emit the error you have received.

To access your data as an array in PHP, you need to use json_decode():

$stitchChart = json_decode($_POST['stitchChart'],TRUE); 
echo $stitchChart[1][1][0];

EDIT

Because the jQuery data argument seemingly can't deal with multidimensional arrays, you should use Douglas Crockford's JSON-js library and pass the result into data as a string. NB: use json2.js.

Here is how you could do this:

stitchChartArray = JSON.stringify(stitchChartArray);
$.post('makeChartPackage.php', {'stitchChart': stitchChartArray }, function(data){
    alert(data);
});

If you use this code, my original PHP suggestion should work as expected.

edited Jan 2, 2012 at 15:14

answered Jan 1, 2012 at 22:50

DaveRandom

88.8k11 gold badges159 silver badges174 bronze badges

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

8 Comments

maddogandnoriko Over a year ago

I thought that was going to be it! But now I am getting an error: PHP Warning: json_decode() expects parameter 1 to be string, array given in /Users/tnt/Sites/cross_stitch/makeChartPackage.php on line 34

maddogandnoriko Over a year ago

no matter what I do the array seems to be getting flattened down to just one dimension: array[0]"a string" [1]"a string"etc. when it should be: array[0][0]"rgb color" [1]"symbol path" [1][0]"rgb color"[1]"symbol path"

maddogandnoriko Over a year ago

Tried that and almost the same error: json_decode() expects parameter 1 to be string, array given in /Users/tnt/Sites/cross_stitch/makeChartPackage.php on line 29. Un jsoned the array looks a bit different: Array ( [0] => [[[\"rgb(75, 90, 60)\",\"symbols/177.png\"],[\"rgb(75, 75, 60)\",\"symbols/184.png\"],[\"rgb(75, 90, 60)\",\"symbols/177.png\"],[\"rgb(98, 119, 57)\",\"symbols/210.png\"],[\"rgb(180, 195, 105)\",\"symbols/388.png\"],[\"rgb(165, 165, 120)\",\"symbols/235.png\"],[\"rgb(75, 75, 60)\",\"symbols/184.png\"],[\"rgb(90, 90, 45)\",\"symbols/195.png\"],[\"rgb(120, 1...

DaveRandom Over a year ago

@maddogandnoriko you need to remove the [] from your Javascript - I suspect that if you examine the difference between your code and mine, you'll find that you have stitchChart[] where I just have stitchChart

DaveRandom Over a year ago

@maddogandnoriko I was under this impression also, but the results you get seem to indicate to the contrary. You could try passing them as objects, but I sort of doubt this would fix it... But really, I would say that JSON is the way this sort of thing should be done anyway, especially when working in Javascript, the language from which JSON derives it's syntax...

|

Collectives™ on Stack Overflow

Sending multidimensional array from jQuery to php

1 Answer 1

8 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

8 Comments

Your Answer

Sign up or log in

Post as a guest

Related