converting a two dimensional javascript array to JSON

Question

i've tried a few different json methods (stringify, toJSON, and probably some totally irrelevant others out of desperation) but can't seem to figure out how to stringify this so i can pass it to a php script. i am able to create a two dimensional array that which could be represented something like this:

array(
 'image'=>array(
 0=>'hello.jpeg', 
 1=>'goodbye.jpeg', 
 2=>'etc.jpeg'),
 'resume'=>array(
 0=>'resume.doc'),
 'reel'=>array(
 0=>'reel.mov')
 )

the array looks okay when i print it to console using this dump function. i tried figuring out how to get this to work with objects because i thought i read something that said objects were already JSON friendly, but since i'm not super familiar with javascript i was pretty much floundering about.

edit: some more details... the declaration of my array (when i had it working) was something like this, although i may have messed up:

var fileArray = [];
fileArray['image'] = [];
fileArray['resume'] = [];
fileArray['reel'] = [];
var type;
var name;
var divs = $("#upload-container").children('div');
$.each(divs, function() {
 type = $(this).attr('id');
 name = $(this).html();
 fileArray[type].push(name);
});

• Ignacio Vazquez-Abrams: Are you sure you mean the outer structure to be an array?
• Justin: i think so. if the var was named fileArray, then each element would be something like fileArray['image'][0], fileArray['image'][1], fileArray['image'][2], fileArray['resume'][0], and fileArray['reel'][0].
• Ignacio Vazquez-Abrams: I ask because normally we'd use an object for that, not an array.
• Justin: yeah, part of the problem was declaring the object and mixing up syntax. the equivalent of what i want to do in php would be something like this: foreach($unimportant as $key => $var) { fileArray[$key][] = $var; }, where there are multiple 'vars' categorized under the 'key' branches.
• Ignacio Vazquez-Abrams: But... JavaScript is not PHP.

Answer 1

The object for that array structure might look like this in JavaScript:

var objects = 
[
 {
 'image': [
 { '0': 'hello.jpeg' },
 { '1': 'goodbye.jpeg' },
 { '2': 'etc.jpeg' }
 ]
 },
 {
 'resume': [
 { '0': 'resume.doc' }
 ]
 },
 {
 'reel': [
 { '0': 'reel.mov' }
 ]
 }
]

So now you've got an array of three objects, each of which contains a property (image, resume, reel) that is another array of objects with basically key:value pairs ('0':'hello.jpeg'). Maybe you could simplify it by not bothering to use the indexes:

var objects = 
[
 {
 'image': [ 'hello.jpeg', 'goodbye.jpeg', 'etc.jpeg' ]
 },
 {
 'resume': [ 'resume.doc' ],
 },
 {
 'reel': [ 'reel.mov' ]
 }
]

Then you can use JSON.stringify(objects) to pass to your PHP action.

• nnnnnn: Even the simplified version is still more complicated than the structure in the question. Why would you want an array of objects where each object has only a single property? The structure in my answer directly matches the structure from the question...
• Justin: i think ideally i'd want an array of objects with a fileType property and a name property
• Cᴏʀʏ: @nnnnnn: the OP's goal on the PHP side was to create an array of associative arrays. That's what the simplified version above basically is, except you can't do associative arrays in JavaScript (hence the big ugly object structure). Your example would work just fine, I was just trying to match to the array structure in the PHP.

Answer 2

Your sample expected output on the PHP side has an associative array containing numeric arrays. JavaScript arrays have numeric indexes: if you want strings as keys use a plain object rather than an array because JavaScript objects act like the associative arrays you are thinking of from PHP. The corresponding JavaScript object should look like this:

var fileArray = {
 'image' : [ 'hello.jpeg',
 'goodbye.jpeg',
 'etc.jpeg'],
 'resume' : [ 'resume.doc' ],
 'reel' : [ 'reel.mov' ]
};

In the arrays defined with square brackets the numeric indexes are implied. Note that fileArray is defined with curly braces not square brackets and so is not an array (in spite of its name). This still allows you to use the fileArray['image'] = ... syntax if you want to set the properties one at a time:

var fileArray = {}; // an object, not an array
fileArray['image'] = [];
fileArray['resume'] = [];
fileArray['reel'] = []; 

Note that the curly brackets in the initial declaration make it an object but properties are still accessed with square bracket syntax.

The way you were defining fileArray as a JavaScript array with square brackets still allows you to add string-based key properties because arrays are objects, but JSON stringify routines may ignore those properties and only serialise the numerically indexed properties.

• Justin: how would this be dynamically declared though? push wouldn't work on an object for me.
• Ignacio Vazquez-Abrams: But you're not pushing on the object, you're pushing on the array stored in the object attribute.
• nnnnnn: Your code should work as-is if you just change the initial declaration of fileArray to be var fileArray = {}. Your next three lines add properties image, resume and reel each of which is an array. Within your .each loop fileArray[type] accesses one of those arrays, and fileArray[type].push(name); pushes the name value into the associated array.
• Justin: yep, that did it. ignacio, nnnnnnnnnnnnnnnnnn, thanks a ton!