jQuery AJAX，数组没有被序列化

Question

I'm trying to post a multidimensional array using jQuery. I have verified that immediately before sending the array, it contains the contents it is supposed to (by checking specific elements and alerting them).

However, when I send the request, it's sending this:

Array
(
    [undefined] => 
)

Here's the whole thing...

           var mainArray = new Array();
           $(".list").each(function(){
               var day = $(this).attr("id");
               var order = 1;
               $("#" + id + " li").each(function(){
                   var subArray = new Array();
                   var id = $(this).attr("id");
                   subArray["id"] = id;
                   subArray["order"] = order;
                   subArray["day"] = day;
                   mainArray.push(subArray);
                   order++;
               });
           });

           // This displays what I would expect
           alert(mainArray[0]['id']);
           alert(mainArray[1]['id']);
           alert(mainArray[2]['id']);
           alert(mainArray[3]['id']);

           // This doesn't work
           $.ajax({
                type: 'post',
                url: 'test2.php',
                data: mainArray,
                success: function(data) {
                    $("#test").html(data);
                }
            });

Any ideas? My understanding is that jQuery is supposed to serialize the array automatically?

Answer 1

Stringyfy the data before you send it to the server

Also it's a better practice to send the data as a Map..

Instead of this

data: mainArray,

Try

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

Answer 2

Your code is totally wrong!

At first, give your 2-dimensional array some name for example items (or whatever you want). Second, you can't use Array for creating hash (theoretically you can but it's bad and jQuery doesn't understand this), you have to use object literals {} instead of Array , use Array only with numeric keys (use literals [] for creating array instead of new Array ). Your code:

var mainArray = [];
$(".list").each(function(){
   var day = $(this).attr("id");
   var order = 1;

   $("#" + id + " li").each(function(){
       var subArray = {};

       subArray["id"] = $(this).attr("id");
       subArray["order"] = order;
       subArray["day"] = day;

       mainArray.push(subArray);
       order++;
   });
});

$.ajax({
    type: 'post',
    url: 'test2.php',
    data: { items: mainArray },
    success: function(data) {
        $("#test").html(data);
    }
});

PS : you can use $.param (convert js objects into query string) to figure out your mistakes