Question

我有一个.NET MVC应用程序。在其中一个观点中，有一种模式。在模态中，有一个表格。

一些笔记......

因为表单在一个模态中，我试图使用一个小的ajax来阻止表单进行默认提交。
表单本身在局部视图中
我正在使用标准的内置MVC验证脚本以及局部视图模型中的数据注释。例如：
```
[Display(Name = "Address")]
[Required()]
[StringLength(200)]
public string Address { get; set; }
```

这是我试图用来阻止默认提交的脚本：

        $(function () {
            var frm = $('#form-accountprofileedit');
            frm.submit(function (ev) {
                ev.preventDefault();
                $.ajax({
                    type: frm.attr('method'),
                    url: frm.attr('action'),
                    data: frm.serialize(),
                    success: function (data) {
                        alert('ok');
                    }
                });
            });
        }

单击提交按钮并且必填字段为空时，我需要显示验证消息。但是，相反，弹出“确定”对话框，表明验证成功。

我做错了什么？

（如果需要，我可以发布更多代码。）

编辑后：

这是表格（瘦身）：

@using (Html.BeginForm("AccountProfileEdit", "Account", FormMethod.Post, new { id = "form-accountprofileedit", @class = "full-form" }))
    {
    @Html.ValidationSummary(true)

    @Html.CustomTextboxFor(model => model.Address)

    <div style="text-align:right;">
        <button type="submit" id="accountprofileedit-submit" name="accountprofileedit-submit" value="Edit Account" class="btn btn-primary" style="margin-left:5px;">Edit Account</button>
        <button type="button" class="btn btn-primary" data-dismiss="modal">Cancel</button>
    </div>
}

Answer 1

问题在于，无论ModelState是否有效，当您从Post操作返回局部视图时，控制器总是会返回200（OK）状态。您可以通过设置响应状态代码来覆盖它。

if (!ModelState.IsValid)
{
    Response.StatusCode = 400;
    return PartialView("_FormBody", model);
}

然后，您需要使用服务器的响应替换表单主体，以显示验证消息。

$(function () {
    var frm = $('#form-accountprofileedit');
    frm.submit(function (ev) {
        ev.preventDefault();
        $.ajax({
            type: frm.attr('method'),
            url: frm.attr('action'),
            data: frm.serialize(),
            success: function (data) {
                alert('ok');
            },
            error: function (xhr, status, error) {
            $('#form-accountprofileedit').html(xhr.responseText);
        }
        });
    });
}

注意：请勿替换整个表单元素，否则将删除提交处理程序。

Ajax表单提交w / preventDefault（）总是命中成功

1 个答案: