MVC 使用 ajax 发送模型

Question

我在尝试使用 ajax 将数据发送回我的保存方法时遇到问题。我想这样做是因为我通过使用相同的保存功能将表单呈现为部分页面，从而在多个屏幕中重用表单。

我遇到的问题是，当我这样做时，它确实可以工作并将其发送回我的保存函数，但是当页面加载并且没有获得更新的值时会生成序列化的 Json。我想通过 ajax 获取更新后的值，理想情况下不必捕获页面上每个字段的值。

下面是我现在使用的代码，它确实可以使用模型中列出的原始值发送回我的保存方法

$("#Save").click(function () {
    var form = $('#Form');

    if (form.valid()) {
        var data = '@Html.Raw(Newtonsoft.Json.JsonConvert.SerializeObject(@Model))';

        $.ajax({
            url: "/Save",
            type: 'POST',
            data: JSON.stringify({ modelJson: data }),
            contentType: 'application/json',
            success: function (result) {
                SaveFade();
            }
        });
    }

    return false;
});

Answer 1

首先，请在 jQuery 的 $.ajax 方法返回的 Deferred 上使用 .done、.fail 和 .always 方法，而不是 success。 其次，不要在 JavaScript 中直接使用 Razor 方法，因为单引号字符 ' 可能会导致语法错误。而是使用 id 关闭隐藏的 div 中的这些数据，例如： <div id="formData">@Html.Raw(Newtonsoft.Json.JsonConvert.SerializeObject(@Model))</div>，然后在 JavaScript 中执行：var data = $('#formData').html();。这样您还可以将脚本移动到单独的 .js 文件中。

回答您的问题，您必须使用 ajax 将实际表单发送到控制器方法。关闭表单中的所有字段，为表单@using(Html.BeginForm("Method", "Controller", FormMethod.Post, new { id = "myForm" }))分配id，并使用AJAX发送：

    $("#Save").click(function () {
        var form = $('#Form');

        if (form.valid()) {
            var data = form.serialize();

            $.ajax({
                url: "/Save", //you can get also action attribute from form using form.attr('action')
                type: 'POST',
                data: data
            }).done(function (result) {
                SaveFade();
            });
         }

         return false;
     });

关于 ASP.NET MVC 中表单的好教程：http://blog.michaelckennedy.net/2012/01/20/building-asp-net-mvc-forms-with-razor/