如何使用JQuery Ajax提交表單和JSON數組

Question

我想提交一個表單並在一次調用中將Json數組發回操作方法。

[HttpPost] 
    public ActionResult Add(AddQuoteRequestVM model, List<Item> itemList) 
    { 
    } 

Ajax代碼

form = jQuery('#createQuoteForm').serialize(); 


    var ItemList = $.parseJSON(ko.toJSON(viewModel.ItemList())); 
    var data = { model: form,itemList: ItemList }; 
     $.ajax({ 
      url: "Add", 
      type: "POST", 
      data: data, 

    }); 

目前我得到空值的操作方法兩個參數。

Answer 1

我設法通過在jquery對象serializeObject中包含一個原型方法來解決這個問題。以下Link非常有用。此方法返回一個JavaScript對象，每個屬性都作爲輸入字段的名稱和值。回發時，json綁定現在可以映射到模型屬性。

$.fn.serializeObject = function() { 
    var o = {}; 
    var a = this.serializeArray(); 
    $.each(a, function() { 
     if (o[this.name] !== undefined) { 
      if (!o[this.name].push) { 
       o[this.name] = [o[this.name]]; 
      } 
      o[this.name].push(this.value || ''); 
     } else { 
      o[this.name] = this.value || ''; 
     } 
    }); 
    return o; 
}; 

阿賈克斯更新的代碼

form = jQuery('#createQuoteForm').serializeObject(); 

    var ItemList = $.parseJSON(ko.toJSON(viewModel.ItemList())); 
    //var ItemList = ko.toJSON(viewModel.ItemList()); 
    var data = JSON.stringify({ model: form,itemList: ItemList }); 
     $.ajax({ 
      url: "Add", 
      type: "POST", 
      data: data, 
      contentType: 'application/json; charset=utf-8', 

    });