在回发表单状态和 JQuery 重置上使用 Ajax 的 MVC 发布表单答案

【问题标题】：MVC post form using Ajax on post back form state and JQuery reset在回发表单状态和 JQuery 重置上使用 Ajax 的 MVC 发布表单
【发布时间】：2017-04-19 23:12:14
【问题描述】：

我希望有人能指出关于 Ajax 帖子的正确方向。我有一个很长的表格，其中有许多问题，这些问题根据之前选择的值进行切换。当我使用 Ajax 发布表单时，表单提交成功，_Success Partial 正确显示。但是，如果我在表单中出错然后提交。在回发时，所有 JQuery 停止工作，MVC @Html.ValidationMessageFor 正确显示，但切换字段与绿色验证一起重置。

如何保持之前的状态？还是我做错了，有更好的方法吗？

提前致谢！

我的代码示例：

查看

<div id="test-container">
    @Html.Partial("_PartialView",Model)
</div>

局部视图

<form method="post" action="@Url.Action("SendReport","Report")" data-form-ajax="true" data-form-target="#test-container">


// form fields here

控制器

if (Request.IsAjaxRequest())
            {
                if (!ModelState.IsValid)
                {
                    // set model 
                    return PartialView("_PartialView",model);
                }

                // more model methods

                if (model.RecordMessage.Type == MessageType.Success)
                {
                    return PartialView("_Success", model);
                }
                else
                {
                    return PartialView("_PartialView", model);
                }
            }

Ajax

var ajaxSubmitForm = function () {


    var $form = $(this);

    var options = {
        url: $form.attr("action"),
        type: $form.attr("method"),
        data: $form.serialize()
    };

    $.ajax(options).done(function (data) {


        $("#test-container").html("");
        $("#test-container").append(data);
    });

    return false;
};


$("form[data-form-ajax='true']").submit(ajaxSubmitForm);

【问题讨论】：

标签： jquery ajax asp.net-mvc

【解决方案1】：

要重新启用验证，您可以将表单附加回 jquery 验证器。这应该在附加本身之后处理。

var form = $("#myForm");
form.removeData('validator');
form.removeData('unobtrusiveValidation');
$.validator.unobtrusive.parse(form);

如果您使用一些 jquery 插件，可能还需要重新激活这些切换。

【讨论】：

感谢克里斯蒂安的解决方案。我刚刚注意到这篇文章，这实际上也是我最终做的！