当我在ASP.NET Core中发送多个属性时，如何使用Ajax将数据发布到控制器模型

Question

这是我以前从未遇到过的事情，我使用Ajax和jQuery将表单数据发布到我的控制器操作中。我面临的问题是，我从表单发送的数据不会自动绑定到控制器中的模型类，我想知道如何实现这一点。

这是我到目前为止的代码，请注意placeholderElement是在我的脚本中其他地方定义的模态。

placeholderElement.on('click', '[data-save="view"]', function (event) {
event.preventDefault();
//Form Data
var form = $(this).parents('.modal').find('form');    
var dataToSend = form.serialize();
//Grid Selection
var getColumns = $("#columnGrid tr.k-state-selected");
var selectedColumns = [];
//Iterate over selected grid values and add to array
$.each(getColumns, function (e) {
var row = $(this);
var grid = row.closest(".k-grid").data("kendoGrid");
var dataItem = grid.dataItem(row);
selectedColumns.push(dataItem.Id);
});
//Post to controller
console.log(selectedColumns)
console.log(dataToSend)
$.post({
url: "/Position/AddCustomView/",
data: {
columns: selectedColumns,
data: dataToSend
},
dataType: 'json',
contentType: 'application/x-www-form-urlencoded; charset=UTF-8',   
success: function (data) {                
}
});
});

您将从上面的代码中看到，我获得了表单数据并对其进行序列化，以便发布。我还从启用了选择的kendoui网格中获取值。然后我将这两组信息发布到我的控制器：

data: {
columns: selectedColumns,
data: dataToSend
},

这是我的控制器。接收columns没有任何问题，但我期望data: dataToSend绑定到UserView model，但它没有。

public JsonResult AddCustomView(UserView model, string[] columns)
{
//shortened for brevity.
}

我做错了什么？我如何将dataToSend绑定到model？

Answer 1

我在评论部分提到了一个解决方案，它是如何由Microsoft文档指定的。或者，你可以通过下面的选项更简单，而不是form.serialize((。在通过ajax.post发送之前，最好先在脚本中获取数据。例如，它可以在函数中完成

function postToController(){
//Post to controller
console.log(selectedColumns)
console.log(dataToSend)
var modelToSend = {
"nameOfField1":"write here value for field 1",
"nameOfField2":"write here value for field 2" 
//just as much fields as your model has
};
$.post({
url: "/Position/AddCustomView/",
data: {//the name of the values you send in post should match with those received in controller
model: modelToSend,
columns: selectedColumns
}, 
success: function (data) {                
}
});
}