javascript - MVC 表单 Javascript Post 在 Controller 内为空

Question

我正在使用 MVC，并且在我的 View 中有一个表单，如下所示

@using(Html.BeginForm(null, null, FormMethod.Post)) {
    @Html.HiddenFor(m => m.Id)
    @Html.HiddenFor(m => m.SysCreated)
    @Html.HiddenFor(m => m.SysDeleted)

    @Html.TextBoxFor(m => m.Name, new { @class = "form-control" })
    <input typeof="button" value="Create New" onclick="newSchool(this)" class="btn btn-sm btn-primary btn-block btn-signin" style = "margin-bottom:20px" / >
}

我尝试使用 JavaScript 函数发布此内容，以避免页面刷新。我有以下功能

function newSchool(btnClicked) {
    var $form = $(btnClicked).parents('form');
    var data = $form.serialize();

    console.log(JSON.stringify(data));
    $.ajax({
        url: '@Url.Action("AddSchool", "SetupSchools")',
        type: 'POST',
        contentType: "json",
        data: {
            newSchool: JSON.stringify(data)
        },
        success: function() {
            DevExpress.ui.notify('School Added', 'success', 1500);
        },
        failure: function(xhr, textStatus, errorThrown) {
            DevExpress.ui.notify('Error - ' + XMLHttpRequest.responseText, 'error', 1500);
        },
    });
}

我可以在控制台中看到数据在那里并且看起来正确，但是我的 Controller 中的数据始终为空。我的 Controller 如下所示

public void AddSchool(Models.School school)
{
}

如何正确发送数据？或者，是否有更好的方法可以在不刷新表单的情况下发布数据。

Answer 1

正如一些评论所建议的，您需要删除 contentType: json 并使用 data: $("form").serialize() ，以及我个人的建议使用 cache: false 始终将数据发送到 Controller ，如果我没记错的话，IE 用于缓存 ajax 请求(如果看起来相同)。

这是一个“ fiddle ”，您可以看到它正在与您当前的代码配合使用:

https://dotnetfiddle.net/IGaQnt

你的代码应该是这样的:

function newSchool(btnClicked) {
        var $form = $(btnClicked).parents('form');
            var data = $form.serialize();

            console.log(JSON.stringify(data));
            $.ajax({
                url: '@Url.Action("AddSchool", "Home")',
                type: 'POST',
                cache: false,
                data: data,
                success: function(result) {
                    alert(result); //I return the name the user submited, you can do whatever you want here.
                },
                failure: function(xhr, textStatus, errorThrown) {
                    DevExpress.ui.notify('Error - ' + XMLHttpRequest.responseText, 'error', 1500);
                },
            });
        }

我决定在 fiddle 中使用 JsonResult 代替 void，我不知道您完整的代码，因此请根据需要更改它。