jQuery AJAX post array

Question

I have this JavaScript array:

testarr = new Array();
testarr[0] = new Array();
testarr[0]["#FFFFFF"] = "White";
testarr[0]["#FFFFFF"] = new Array();
testarr[0]["#FFFFFF"]["#FFFFFA"] = "A";
testarr[0]["#FFFFFF"]["#FFFFFB"] = "B";

testarr[0]["#000000"] = "Black";
testarr[0]["#000000"] = new Array();
testarr[0]["#000000"]["#000001"] = "A1";
testarr[0]["#000000"]["#000002"] = "B1";

I use this jQuery AJAX post method:

$.ajax({
  type: 'POST',
  url: 'backEndFile.php',
  dataType: 'json',
  data: {cat:testarr},
    success: function(data) {
      if (data.success === true) {
        alert("SUCCESS");
      } else {
        alert("NOT SUCCESS")
      }
    }
  });

my backEndFile.php

<?php
  var_dump($_POST);
?>

In backEndFile var dump prints: array(0) {} not found me post array.

if I change me array keys from string to digits like this:

testarr[0] = new Array();
testarr[0][0] = "White";
testarr[0][0] = new Array();
testarr[0][0][0] = "A";
testarr[0][0][1] = "B";

testarr[0][1] = "Black";
testarr[0][1] = new Array();
testarr[0][1][0] = "A1";
testarr[0][1][1] = "B1";

then prints correctly

Tip: Replace your me with my. It's unrelated, but it's worth it fixing them. — emerson.marini
– emerson.marini, Commented Aug 20, 2014 at 14:30
Try serializing your object to JSON, use JSON.stringify: data: JSON.stringify({cat:testarr}). Currently jQquery might be seriliazing your object to url encoded form. — tpeczek
– tpeczek, Commented Aug 20, 2014 at 14:33
i try: data: JSON.stringify({cat:testarr}) doesn't get result.. — jsphp
– jsphp, Commented Aug 20, 2014 at 14:37
Javascript arrays don't have string indices, you appear to require an array containing objects. Also, you overwrite the value "Black" with new Array() on the next line. — James
– James, Commented Aug 20, 2014 at 14:40
To properly validate the JSON your are receiving in PHP try following: echo file_get_contents('php://input'); — tpeczek
– tpeczek, Commented Aug 20, 2014 at 14:43

Quentin · Accepted Answer · 2014-08-20 14:50:26Z

JavaScript arrays are designed for holding data with sequential, numeric key names.

When jQuery serialises them for an Ajax request, it will only include the numeric keys (because it is an array, so why would you put named keys on it?).

If you want to have named keys, then use an Object, not an Array.

testarr = new Array();
testarr[0] = new Object();
testarr[0]["#FFFFFF"] = "White";
testarr[0]["#FFFFFF"] = new Object();
testarr[0]["#FFFFFF"]["#FFFFFA"] = "A";
testarr[0]["#FFFFFF"]["#FFFFFB"] = "B";

testarr[0]["#000000"] = "Black";
testarr[0]["#000000"] = new Object();
testarr[0]["#000000"]["#000001"] = "A1";
testarr[0]["#000000"]["#000002"] = "B1";

Note that you are overwriting your White and Black values with arrays. You probably don't want to do that.

(In general, you should also prefer the literal syntax ([]/{}) to the constructor syntax (new Array/new Object)).

testarr = [];
testarr[0] = {};
testarr[0]["#FFFFFF"] = "White";
testarr[0]["#FFFFFF"] = {};
testarr[0]["#FFFFFF"]["#FFFFFA"] = "A";
testarr[0]["#FFFFFF"]["#FFFFFB"] = "B";

testarr[0]["#000000"] = "Black";
testarr[0]["#000000"] = {};
testarr[0]["#000000"]["#000001"] = "A1";
testarr[0]["#000000"]["#000002"] = "B1";

But then you can go the whole hog and just use literal syntax throughout:

testarr = [
        {
                "#FFFFFF": {
                        "#FFFFFA": "A",
                        "#FFFFFB": "B"
                },
                "#000000": {
                        "#000001": "A1",
                        "#000002": "B1"
                }
        }
];

jolsalazar · Accepted Answer · 2014-08-20 14:57:13Z

1

Try this,

testarr = {}
testarr[0] = {}
testarr[0]["white"] = {}
testarr[0]["white"]["#FFFFFA"] = "A";
testarr[0]["white"]["#FFFFFB"] = "B";

testarr[0]["black"] = {}
testarr[0]["black"]["#000001"] = "A1";
testarr[0]["black"]["#000002"] = "B1";

console.log(testarr[0].white);

answered Aug 20, 2014 at 14:57

jolsalazar

4183 silver badges8 bronze badges

Comments

James · Accepted Answer · 2014-08-20 14:48:47Z

0

Here is a more reasonable way of generating your structure:

var testarr = [{
  "#FFFFFF": {
    "#FFFFFA": "A", 
    "#FFFFFB": "B"
  },
  "#000000": {
    "#000001": "A1",
    "#000002": "B1"
  }
}];

console.log(testarr[0]["#000000"]["#000001"]); // result "A1"

answered Aug 20, 2014 at 14:48

James

22.4k5 gold badges29 silver badges44 bronze badges

Comments

kbonnelly · Accepted Answer · 2014-08-20 14:37:39Z

-1

Try decoding your data on your PHP side.

json_decode(YOURDATA);

or just like @tpeczek commented, try JSON.stringify({cat:testarr}) when posting it.

answered Aug 20, 2014 at 14:37

kbonnelly

1891 gold badge1 silver badge13 bronze badges

1 Comment

jsphp Over a year ago

i try it doesn't work.. already get result empty array: array(0) {}

Collectives™ on Stack Overflow

jQuery AJAX post array

4 Answers 4

Comments

Comments

Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

Comments

Comments

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related