Pass multi-dimensional array in ajax request with jQuery

Dec 25th, 2008
I have a bunch of javascript objects flying around page that interacts with Google Maps, and I wanted to get the data out of some of the objects to pass via a jQery AJAX $.post call to a PHP script. jQuery seems to have everything, so I was surprised there wasn't any functionality built in to do this (at least as far as I am aware of). I found JSON stringify, which may come in very handy in the future, but seemed like overkill for this particular instance, as I needed a very limited set of data. Below is the code I came up with. My object lineM has an array of Line objects (lineM.lines), and I added a method getWaypoints to the Line object prototype (this method returns a regular javascript array). Then it's just a matter of creating an object literal, and adding properties with "[]" appended to the property name. var params = {}; for(var i = 0; i < lineM.lines.length;i++) { params['line'+i+'[]']=lineM.lines[i].getWaypoints(); } $.post('/test.php',params,function(data) { $("#ieTest").text(data); }); When I spit out the results in PHP, I get : Array ( [line0] => Array ( [0] => 47.399458084,-121.393484585 [1] => 47.405251153,-121.395479813 [2] => 47.412148202,-121.397021664 [3] => 47.419077186,-121.395984907 [4] => 47.422244288,-121.387493955 [5] => 47.427556822,-121.382973259 [6] => 47.431650627,-121.383301159 [7] => 47.433441086,-121.382011855 [8] => 47.432344733,-121.381145837 [9] => 47.431196412,-121.37981873 ) [line1] => Array ( [0] => 47.457933301545786,-121.42310857772827 [1] => 47.46124106812506,-121.41435384750366 [2] => 47.46318500928391,-121.40516996383667 [3] => 47.45874575472201,-121.40710115432739 [4] => 47.458716738753324,-121.41165018081665 ) [line2] => Array ( [0] => 47.45471721756243,-121.42242193222046 [1] => 47.45404979509893,-121.41409635543823 [2] => 47.4578510880274,-121.41624212265015 [3] => 47.45634221074817,-121.40671491622925 [4] => 47.459766139142666,-121.40469789505005 ) )

Posted In: PHP, JavaScript

Commentary

Patryk Januszewski 2009-03-30 01:14:17

Thanks for pointing me in the right direction! I've been having trouble passing a simple array through prototype's Ajax.Request or Updater calls. I'd constantly come up with php receiving the value as only the last element, or an [object Object] type. My solution for it was slightly different from yours, but pretty much the same thing: var something = []; something[0] = "bimmer"; something[1] = "empire"; Ajax.Request('ajax/process.php', { method: 'post', parameters: { 'something[]':something } } ); PHP ends up with an associative array of values -which is exactly what I needed/preferred. Thanks!

johno 2009-09-28 00:13:58

I could nopt get this to work without getting a error: On the php side: echo $_POST['something[]'];// retrurns false;

Tim White 2009-12-26 18:51:44

Here's a how-to on the methods I use to get multidimensional data passed to PHP with AJAX(including JSON stringify functions): http://www.zulius.com/how-to/sen-multidimensional-arrays-php-with-jquery-ajax/