Question

我正在使用ASP.NET MVC。我的验证工作正常，直到我将一个事件附加到表单的onSubmit事件。

这是我的表单的外观：

@using (Html.BeginForm("Recover", "Auth", FormMethod.Post, new { Id = "RecForm", onSubmit = "return Events.Submit(this,event)" }))
{
        @Html.TextBoxFor(model => model.Email)
        @Html.ValidationMessageFor(model => model.Email)
        <input type="submit" value="Recover" />
}

Javascript（工作正常，只需将其放在此处，以便您可以检查此处的某些内容是否导致验证无法触发）：

//Events
window.Events = (function () {

    // Baseline setup
    var Events = {};

    function disableAllChildren(el) {
        $(el).find(':input').attr('disabled', true);
    }
    function enableAllChildren(el) {
        $(el).find(':input').attr('disabled', false);
    }

    //Ajax submit
    Events.Submit = function (el, event) {
        event.preventDefault();
        //serialize the form before disabling the elements.
        var data = $(el).serialize();

        disableAllChildren(el);
        $(el).find('.success, .error').hide();
        $.ajax({
            url: el.action,
            type: 'POST',
            data: data,
            success: function (data) {
                //Stuff happens.
            }
        });
    };
    return Events;
})(this, this.document);

如何取回我的验证？

Answer 1

我所做的是在提交表单之前检查表单是否有效。请参阅以下代码：

$form = $("#myForm");

if (form.valid()) {

    form.validate();
    //other codes here

 }

如果表单有效，请发布您的数据。如果没有，什么都不做。

Answer 2

您的代码中存在的问题多于验证问题。情况是disabled字段未发布到服务器。他们也没有参与验证。因此，即使您的代码有效，您也不会在服务器端发布任何内容。删除disableAllChildren(el);或将其重新编码为禁用字段，但可以将它们设为只读。

有了这个，他们将得到验证，但在ajax提交之后并不奇怪。这是您不应该的行为，因此请查看validate method。特别是你应该感兴趣的部分

在有效时通过Ajax提交表单。

我相信通过验证形式的ajax提交可以更轻松。

$(".selector").validate({ submitHandler: function(form) { $(form).ajaxSubmit(); } })

或者，只需在ajax提交之前添加验证检查

实现onSubmit事件后，Jquery Unobtrusive验证丢失

2 个答案: