AJAX將數組數據作為JSON對象發送

Question

我有一個表單，我想獲取表單的特定元素並將值存儲在數組中。

var that = $(this),
url = that.attr('action'),
type = that.attr('method'),

data = {};

var item_name = miniform.elements['itemId'].value;
var quantity = miniform.elements['quantityId'].value;
var amount = miniform.elements['amountId'].value;
var total = amount * quantity;
var cart = ["Item: ",item_name,"Quantity: ",quantity,"Amount: ",amount,"Total: ",total];

然后，我想將此數組轉換為JSON對象，並通過ajax將其發送到php文件，但無法正常工作。 這是我的ajax代碼：

$.ajax({
    url: url,
    type: type,
    Content-Type:'application/JSON',
    data: JSON.stringify(cart),
    success: function(){
        console.log('Message Sent');
     }
    });

可能是什么問題呢？？

Answer 1

您可以使用formdata()發送整個表單。 您有沒有理由嗎？

無論如何，它不起作用，因為您不是在創建json對象，而是在創建普通數組。 有區別。 實際上，您可以直接將json直接放入ajax調用中，而不必對其進行字符串化。

var cart = {};
cart['Item'] = item_name;
cart['Quantity'] = quantity;
cart['Amount'] = amount;
cart['Total'] = total;

$.ajax({
  url: 'https://www.google.com',
  type: "POST",
  //Datatype causes it to automatically become json and will expect json back
  //return json back from php through json_encode($myArray);       
  dataType: "json",
  data: cart,
  success: function() {
    alert('Message Sent');
  }
});

簡而言之：您使用了錯誤的括號:)

我只是將其更改為一種更輕松的對象管理方式。 您先前的對象的問題在於它的構建錯誤。 應該是這樣的：

var cart = {"Item":item_name,"Quantity": quantity,"Amount":amount,"Total":total};

Answer 2

你做錯了。

請用這種方式

var cart = {"Item ":item_name,"Quantity ":quantity,"Amount ":amount,"Total ":total};

$.ajax({
url: url,
type: type,
Content-Type:'application/JSON',
data: JSON.parse(cart),
success: function(){
    console.log('Message Sent');
 }
});

如果要發布數組，則可以使用這種方式。

cart = [];
cart[0] = item_name;
cart[1] = quantity;
cart[2] = amount;
cart[3] = total;

$.ajax({
url: url,
type: type,
Content-Type:'application/JSON',
data:{cart:cart},
success: function(){
    console.log('Message Sent');
 }
});

Answer 3

看逗號，應該是{"key":value, "key":value..}而不是{"key":,value, "key":,value..}

var cart = {"Item" : item_name, "Quantity" : quantity, "Amount" : amount, "Total" : total};

Answer 4

不要手動構建

像這樣容易出錯，而不是手動構建容易出錯的Object或Array：

賓語

// Define your empty Object
var cart = {};

// Assign its properties
cart.item_name = miniform.elements['itemId'].value;
cart.quantity = miniform.elements['quantityId'].value;
cart.amount = miniform.elements['amountId'].value;
cart.total = amount * quantity;

排列

或者，如果您更喜歡使用數組：

// Define your empty array
var cart = [];

// Assign its properties
cart['item_name'] = miniform.elements['itemId'].value;
cart['quantity'] = miniform.elements['quantityId'].value;
cart['amount'] = miniform.elements['amountId'].value;
cart['total'] = amount * quantity;

現在，您已經准備好cart對象或數組，可以對其調用JSON.stringify ：

JSON.stringify(cart);

Answer 5

我找到了解決問題的方法，並結合了您的一些回答以找到答案。

$('#miniform').on('submit',function(){  
    var that = $(this),
    url = that.attr('action'),
    type = that.attr('method'),

    data = {};
    var cart = {};

    cart.item_name = miniform.elements['itemId'].value;
    cart.quantity = miniform.elements['quantityId'].value;
    cart.amount = miniform.elements['amountId'].value;
    cart.total = cart.amount * cart.quantity;

    var jsonString = JSON.stringify(cart);

   $.ajax({
    url: url,
    type: type,
    data:{data:jsonString},
    success: function(){
        console.log('Email Sent');
     },
     error: function(error){
     throw new Error('Did not work');
      }
    });
 return false;
 });