如何使用JQuery Ajax提交表单和JSON数组

问题描述:

我想提交一个表单并在一次调用中将Json数组发回操作方法。如何使用JQuery Ajax提交表单和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, 

    }); 

目前我得到空值的操作方法两个参数。

+1

而不是'$ .parseJSON'你应该使用'JSON.stringify' – Michael 2014-08-27 17:56:37

我设法通过在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', 

    });