Can't pass Javascript array to PHP via Ajax

Question

I've been tearing my hair out at such a simple problem. I have the following JS array:

    var orderDetailsArray = new Array();
    orderDetailsArray[0] = 'test 1';
    orderDetailsArray[1] = 'test 2';
    orderDetailsArray[2] = 'test 3';
    orderDetailsArray[3] = 'test 4';

Then I have the following Ajax code to send this array to a PHP file

    $.ajax({  
       type: "POST",
       url: 'http://testdomain.com/file.php',
       data: JSON.stringify(orderDetailsArray),
       contentType: "application/json",
       success: function(data) {
            alert(data);
       }
    });

In my PHP file I have the following

   $orderDetailsArray   = json_decode($_POST['orderDetailsArray']);                     
   echo $orderDetailsArray[0];

But for some reason alert(data) always just returns blank. I have no idea why this doesn't return the correct values.

Any help would be really great.

Thanks

So do you want to send JSON or receive url encoded form data? — Musa, Aug 28 '14 at 12:12

score 4 · Answer 1 · answered Aug 28 '14 at 12:08

4

You did not name your array in the client side before sending it, therefore the whole of $_POST is this array, and $_POST['orderDetailsArray'] is undefined.

You must name it client-side:

$.ajax({  
   type: "POST",
   url: 'http://testdomain.com/file.php',
   data: {
       orderDetailsArray: JSON.stringify(orderDetailsArray)
   },
   contentType: "application/json",
   success: function(data) {
        alert(data);
   }
});

answered Aug 28 '14 at 12:08

Jean-Karim Bockstael

1,365
9
17

Um I'm still getting an empty response alert with this – user2028856 Aug 28 '14 at 12:18

score 1 · Answer 2 · answered Aug 28 '14 at 12:05

1

data: { orderDetailsArray: JSON.stringify(orderDetailsArray)}

answered Aug 28 '14 at 12:05

Spokey

10,741
2
23
40

score 1 · Answer 3 · answered Aug 28 '14 at 12:12

1

Your post data is not a key value pair, so you cant access in via key in php.

Either use the php input stream:

$orderDetailsArray   = json_decode(file_get_contents('php://input'));

OR set a key in your ajax:

data: { orderDetailsArray: JSON.stringify(orderDetailsArray)}

answered Aug 28 '14 at 12:12

Steve

19,825
5
37
61

Um I'm still getting an empty response alert with this – user2028856 Aug 28 '14 at 12:20
For the second option your content type is incorrect. – Musa Aug 28 '14 at 12:22

score 1 · Answer 4 · answered Aug 28 '14 at 12:16

1

You should declare array like this and then can directly pass it ajax. (No need to stringify)

var orderDetailsArray = {};
orderDetailsArray[0] = 'test 1';
orderDetailsArray[1] = 'test 2';
orderDetailsArray[2] = 'test 3';
orderDetailsArray[3] = 'test 4';

$.ajax({  
    type: "POST",
    url: 'http://testdomain.com/file.php',
    data: {'order_details':orderDetailsArray},
    contentType: 'application/x-www-form-urlencoded',
    success: function(data) {
        alert(data);
    }
});

answered Aug 28 '14 at 12:16

Mad Angle

2,272
1
13
30

I doubt that without stringify that it would would work. Post data is usually serialized when using ajax. – Peter Aug 28 '14 at 12:18
@Peter Its worked for me and thats why i have posted it. Using like this, we dont need convert it to array in PHP. We can directly access it as array in PHP. So $_POST['order_details'] is an array. – Mad Angle Aug 28 '14 at 12:22
And i think its the easiest way. Otherwise we need to convert it into a string in the front end and then in the back end need to convert the string to array and then process:) – Mad Angle Aug 28 '14 at 12:24
by your code above, you created an object not an array, Which would work normally without stringify. But for an array, you have to either serialize or stringify it. – Peter Aug 28 '14 at 13:07

score 0 · Answer 5 · answered Aug 28 '14 at 12:05

0

without dataType

data: {orderDetailsArray :orderDetailsArray},

with dataType

dataType: "json",
data: JSON.stringify({orderDetailsArray:orderDetailsArray}),

answered Aug 28 '14 at 12:05

Punitha Subramani

1,417
1
7
6

If I use dataType, do I still need to include contentType: "application/json", ? – user2028856 Aug 28 '14 at 12:08
I think no need if you use dataType: "json", – Punitha Subramani Aug 28 '14 at 12:08
@punithasubramaniv you're mixing up contentType with dataType, see http://stackoverflow.com/questions/13735869/datatype-application-json-vs-json – Musa Aug 28 '14 at 12:17
yeah thats okay, I dint say strictly use only one. I said not necessary, If you use dataType. For the coding procedure you want to use all somthing like this contentType : "application/json", dataType: 'json'... But am using single dataType without using contentType also I can get the output. Thats why I suggested. Sorry If i confused. – Punitha Subramani Aug 28 '14 at 12:24

score 0 · Answer 6 · answered Aug 28 '14 at 12:08

well you cannot pass the value directly, you need to assign it to a "key" like this

data: {'arr':JSON.stringify(orderDetailsArray)},

and access the same at php side like this

$orderDetailsArray = json_decode($_POST['arr']);

Reference:

http://api.jquery.com/jQuery.ajax/

Happy Coding :)

score 0 · Answer 7 · answered Aug 28 '14 at 12:15

The problem is in the data submitted. On the server side there's no data specified for $_POST['orderDetailsArray']

Change your ajax to:

$.ajax({  
       type: "POST",
       url: 'http://testdomain.com/file.php',
       data: 'orderDetailsArray='+JSON.stringify(orderDetailsArray),
       contentType: "application/json",
       success: function(data) {
            alert(data);
       }
    });

score -1 · Answer 8 · answered Aug 28 '14 at 12:11

Try change the data: data: JSON.stringify(orderDetailsArray)

//by

data: {orderDetailsArrayData:orderDetailsArray}

or

data: JSON.stringify({orderDetailsArrayData:orderDetailsArray})

// in php

$orderDetailsArray   = $_POST['orderDetailsArrayData'];                     
echo $orderDetailsArrayData[0];

or 

$orderDetailsArray   = json_decode($_POST['orderDetailsArrayData']); 
echo $orderDetailsArrayData[0];

Can't pass Javascript array to PHP via Ajax

8 Answers8