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

Question

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

这是到目前为止我的代码，请注意 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网格中获取值。然后我将这两组信息发布到我的 Controller :

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

这是我的 Controller 。 列 接收时没有任何问题，但我期望 data: dataToSend 绑定(bind)到 UserView 模型，但事实并非如此。

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

我做错了什么以及如何将 dataToSend 绑定(bind)到 model？

Answer 1

有我在评论部分提到的解决方案，微软文档是如何指定的。或者您可以通过以下选项采用更简单的方法，而不是 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) {                
    }
 });
}