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

2024-04-21

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

<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...">

除了如何迭代每个数量输入项并将其添加到可以通过 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!');
             }
        });
    },
});

我通常不太了解 Jquery,所以这可能只是 jquery 对象格式化的菜鸟问题。另外,我正在使用 Codeigniter 作为 PHP 框架。你可以在这里看到现场版本 http://422clients.com/f2f/app

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

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

您需要引用您的密钥:

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

或者使用点符号:

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

如果没有引号/点符号,就像这样说:

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

因为它评估具有相同名称的变量。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

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

随机推荐