如何在jquery中创建多维数组/对象并通过AJAX post传递

I am creating an order form that has a table of order items users can purchase. The inputs are using data attributes to store the items name and price per piece like so:

我正在创建一个订单表单,其中包含用户可以购买的订单商品表。输入使用数据属性来存储项目名称和每件的价格,如下所示:

<input type="text" class="input-small quantity-input" data-pid="<?php echo $p['id']; ?>" data-min="<?php echo $p['min_qty']; ?>" data-max="<?php echo $p['max_qty']; ?>" data-price="<?php echo $p['price']; ?>" data-name="<?php echo $p['product_name']; ?>" placeholder="quantity...">

I have everything figured out except for how to iterate over each quantity-input item and add it to a multidimensional array that I can send via an AJAX Post. I currently have the following code, but when I do a print_r on the $_POST value it says: Disallowed Key Characters: Fresh Tilapia Filets

除了如何迭代每个数量输入项并将其添加到我可以通过AJAX Post发送的多维数组之外,我已经弄明白了。我目前有以下代码,但是当我在$ _POST值上执行print_r时,它说:不允许的关键字符:新鲜的罗非鱼片

    $("#ccform").validate({
  rules: {
    firstName: { required: true },
    lastName: { required: true },
    email: {
        required: true,
        email: true,
    },
    cardNumber: { required: true },
    expMonth: { required: true },
    expYear: { required: true },
    cvv: { required: true },
    address: { required: true },
    city: { required: true },
    state: { required: true },
    zipcode: { required: true },
    phone: { required: true },
  },
  submitHandler: function() {
      var siteUrl = $('#siteUrl').val();
      var orderItems = [];
        $('.quantity-input').each(function(){
            var orderItem = $(this).attr('data-name');
            var priceEach = $(this).attr('data-price');
            var qty = $(this).val();
            if(qty != '') {
                obj = {};
                obj[orderItem] = orderItem;
                obj[priceEach] = priceEach;
                obj[qty] = qty;
                orderItems.push(obj);
            }
        });

        var pickupLocation = $('input[name="pickup"]:checked').val();
        var pickupPrice = $('#hidePickupPrice').val();
        var subtotal = $('#hideSubtotal').val();
        var tax = $('#hideTax').val();
        var total = $('#hideTotal').val();

        var firstName = $('#firstName').val();
        var lastName = $('#lastName').val();
        var email = $('#email').val();
        var cardNumber = $('#cardNumber').val();
        var expMonth = $('#expMonth').val();
        var expYear = $('#expYear').val();
        var cvv = $('#cvv').val();
        var address = $('#address').val();
        var address2 = $('#address2').val();
        var city = $('#city').val();
        var state = $('#state').val();
        var zipcode = $('#zipcode').val();
        var phone = $('#phone').val();

        $.ajax({
             type: "POST",
             url: siteUrl + "frontend/pay",
             data: ({ 'orderItems': orderItems, 'pickupLocation': pickupLocation, 'pickupPrice': pickupPrice, 'subtotal': subtotal, 'tax': tax, 'total': total, 'firstName': firstName, 'lastName': lastName, 'email': email, 'cardNumber': cardNumber, 'expMonth': expMonth, 'expYear': expYear, 'cvv': cvv, 'address': address, 'address2': address2, 'city': city, 'state': state, 'zipcode': zipcode, 'phone': phone}),
             success: function(data) {
                 alert('done!');
             }
        });
    },
});

I don't usually get into Jquery this much, so it may just be a noob problem with the formatting of the jquery object. Also, I'm using Codeigniter for the PHP framework. You can see the live version here

我通常不会进入Jquery这么多,所以它可能只是jquery对象格式化的noob问题。另外,我正在使用Codeigniter来构建PHP框架。你可以在这里看到现场版

To clarify, this is the area of the code I need help with. It is not creating a multi dimensional object / array:

为了澄清,这是我需要帮助的代码区域。它不是创建多维对象/数组:

var orderItems = [];
        $('.quantity-input').each(function(){
            var orderItem = $(this).attr('data-name');
            var priceEach = $(this).attr('data-price');
            var qty = $(this).val();
            if(qty != '') {
                obj = {};
                obj[orderItem] = orderItem;
                obj[priceEach] = priceEach;
                obj[qty] = qty;
                orderItems.push(obj);
            }
        });

1 个解决方案

#1

You need to quote your keys:

你需要引用你的钥匙:

obj['orderItem'] = orderItem;
obj['priceEach'] = priceEach;
obj['qty'] = qty;

Or use dot notation:

或使用点符号:

obj.orderItem = orderItem;
obj.priceEach = priceEach;
obj.qty = qty;

Without the quotes/dot notation its like saying:

如果没有引号/点符号,则说:

obj['Fresh Tilapia Filets'] = 'Fresh Tilapia Filets';
obj['$2.99'] = '$2.99';
obj[10] = 10;

Because its evaluating the variables with the same name.

因为它用相同的名称来评估变量。

#1