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
– Musa, Commented Aug 28, 2014 at 12:12

Jean-Karim Bockstael · Accepted Answer · 2014-08-28 12:08:17Z

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, 2014 at 12:08

Jean-Karim Bockstael

1,41510 silver badges18 bronze badges

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

1 Comment

user2028856 Over a year ago

Um I'm still getting an empty response alert with this

Spokey · Accepted Answer · 2014-08-28 12:05:19Z

1

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

answered Aug 28, 2014 at 12:05

Spokey

11k2 gold badges31 silver badges44 bronze badges

Comments

Steve · Accepted Answer · 2014-08-28 12:12:04Z

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, 2014 at 12:12

Steve

20.5k5 gold badges47 silver badges71 bronze badges

2 Comments

user2028856 Over a year ago

Um I'm still getting an empty response alert with this

Musa Over a year ago

For the second option your content type is incorrect.

Mad Angle · Accepted Answer · 2014-08-28 12:16:41Z

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, 2014 at 12:16

Mad Angle

2,3301 gold badge18 silver badges33 bronze badges

4 Comments

Peter Over a year ago

I doubt that without stringify that it would would work. Post data is usually serialized when using ajax.

Mad Angle Over a year ago

@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 Over a year ago

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:)

Peter Over a year ago

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.

Punitha Subramani · Accepted Answer · 2014-08-28 12:05:53Z

0

without dataType

data: {orderDetailsArray :orderDetailsArray},

with dataType

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

answered Aug 28, 2014 at 12:05

Punitha Subramani

1,4621 gold badge8 silver badges6 bronze badges

4 Comments

user2028856 Over a year ago

If I use dataType, do I still need to include contentType: "application/json", ?

Punitha Subramani Over a year ago

I think no need if you use dataType: "json",

Musa Over a year ago

@punithasubramaniv you're mixing up contentType with dataType, see stackoverflow.com/questions/13735869/…

Punitha Subramani Over a year ago

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.

dreamweiver · Accepted Answer · 2014-08-28 12:08:53Z

0

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 :)

answered Aug 28, 2014 at 12:08

dreamweiver

5,9922 gold badges27 silver badges39 bronze badges

Comments

Peter · Accepted Answer · 2014-08-28 12:15:07Z

0

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);
       }
    });

answered Aug 28, 2014 at 12:15

Peter

6,6994 gold badges33 silver badges36 bronze badges

Comments

kelgwiin · Accepted Answer · 2014-08-28 12:11:27Z

-1

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];

answered Aug 28, 2014 at 12:11

kelgwiin

8472 gold badges14 silver badges24 bronze badges

Collectives™ on Stack Overflow

Can't pass Javascript array to PHP via Ajax

8 Answers 8

1 Comment

Comments

2 Comments

4 Comments

4 Comments

Comments

Comments

Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

8 Answers 8

1 Comment

Comments

2 Comments

4 Comments

4 Comments

Comments

Comments

Comments

Linked

Related