如何通过Jquery AJAX post传递多维数组？

Question

我一直在使用Serialize()将复选框表单数据与Post()一起传递给一个篮子，该篮子可以容纳同一类别的多个商品。

当我使用提交按钮发布它们时，它可以很好地处理传递的多个值，并显示在一个类别下。

但是，当我使用Jquery serialize()时，它将为每个类别仅显示一项，并且总共只显示两个类别。这是一个数组问题，但我不能解决它。

有没有我应该用来传递多维数组的替代JQuery函数？

Answer 1

Jquery将直接接受多维数组，不需要序列化。

var data = {
  foo:  123,
  bar:  456,
  rows: [
    {
      column1 : 'hello',
      column2 : 'hola',
      column3 : 'bonjour',
    },
    {
      column1 : 'goodbye',
      column2 : 'hasta luego',
      column3 : 'au revoir',
    },
  ],
  test1:{
    test2: {
      test3:  'baz'
    }
  }
};

PHP文件中的_Post数据将如下所示

Array
   (
    [foo] => 123
    [bar] => 456
    [rows] => Array
        (
            [0] => Array
                (
                    [column1] => hello
                    [column2] => hola
                    [column3] => bonjour
                )

            [1] => Array
                (
                    [column1] => goodbye
                    [column2] => hasta luego
                    [column3] => au revoir
                )

        )

    [test1] => Array
        (
            [test2] => Array
                (
                    [test3] => baz
                )

        )

    )

一旦定义了数据多维数组，Ajax就可以像下面这样简单

$.ajax({
          type:           'post',
          cache:          false,
          url:            './ajax.php',
          data:           data
      });

如果您的post数组中可能有您不知道的字段，您可以使用以下命令轻松地访问php文件中的Post数组

$data = file_get_contents('php://input');
$data = json_decode($data, true);

Answer 2

$.post(url, {"myarray":arrayData}, function(data){/*stuff*/}, 'json');

在服务器端，您可以使用php访问它。

$myArray = $_POST['myarray'][0];
foreach($myArray as $item)
{
   /*logic here for picking apart your array*/
}

Answer 3

这对我很有效，使用jQuery和laravel 8，(递归地)构建一个对象而不是一个数组：

function getSorted(wrapper) {
    let set = {};
    let children = $(wrapper).children('.list-group');
    let index = 0;

    children.each(function(i, item) {
        $(item).children('.list-group-item').each(function(j, section) {
            index++;
            set[index] = {};
            set[index].id = $(section).data('id');
            set[index].subsections = getSorted($(section));
        });
    });

    return set;
}

用ajax以通常的方式发送：

let orderingSet = getSorted($('#sections')); // recursive function for all sections

$.ajax({
    type: 'POST',
    url: sortUrl,
    dataType: 'json',
    data: {'id': sectionId, 'to_id': parentId, 'orderingSet': orderingSet}
})

并从请求中检索到它：$orderingSet = request('orderingSet');

这就是上面创建的多维“数组”的服务器响应的显示方式(只显示其中的一部分)，拖放后，使用特定的数字索引作为部分位置：

​

​