Asp.net mvc 3 尝试添加ajax post函数时MVC3验证失败

我在使用jquery将表单数据发布到控制器时遇到一些验证问题

如果我不使用jquery发表文章，这段代码可以正常工作，验证也可以正常进行

<div id="window">
@using (Html.RequiredFieldsMessage()){}
@using (Html.BeginForm("","",FormMethod.Post,new{id="card-payment"}))
{
    @Html.ValidationSummary(true, "Please fix the errors below.")
    <div class="inputForm no-border">
        <div class="fr">
            @Html.LabelFor(model => model.DpsPaymentModel.CardHolderName)
            @Html.EditorFor(model => model.DpsPaymentModel.CardHolderName)
            @Html.ValidationStyledMessageFor(model => model.DpsPaymentModel.CardHolderName, false)
          </div>
        <div class="fr">
            @Html.LabelFor(model => model.DpsPaymentModel.CardNumber)
            @Html.EditorFor(model => model.DpsPaymentModel.CardNumber)
            @Html.ValidationStyledMessageFor(model => model.DpsPaymentModel.CardNumber, false)
        </div>
        <div class="fr">
            @Html.LabelFor(model => model.DpsPaymentModel.DateExpiry)
            @Html.EditorFor(model => model.DpsPaymentModel.DateExpiry)
            @Html.ValidationStyledMessageFor(model => model.DpsPaymentModel.DateExpiry, false)
        </div>
        <div class="fr">
            @Html.LabelFor(model => model.DpsPaymentModel.Cvc2)
            @Html.EditorFor(model => model.DpsPaymentModel.Cvc2)
            @Html.ValidationStyledMessageFor(model => model.DpsPaymentModel.Cvc2, false)
        </div>
        <div class="fr">
            @Html.LabelFor(model => model.DpsPaymentModel.Amount)
            @Html.EditorFor(model => model.DpsPaymentModel.Amount)
            @Html.ValidationStyledMessageFor(model => model.DpsPaymentModel.Amount, false)
        </div>
        <div class="fr">
            <button type="submit" id="process-payment">Submit</button>
        </div>
    </div>

}
</div>

---

您正在调用

event.preventDefault（）事件

变量，所以我猜您会得到一个javascipt错误。顺便问一下，你看过javascript调试工具的控制台了吗

也许您的意思是单击处理程序将此作为参数：

$("#process-payment").click(function (evt) {
    evt.preventDefault();
    ...
});

但我建议您订阅表单的submit事件，而不是submit按钮的click处理程序。例如，当用户在某个输入字段内按Enter键以提交表单而不是按submit按钮时，这将说明这种情况

另外，验证表单是否有效的正确方法是

form.valid（）

，而不是像您的示例中那样

form.validate（）

，此外，您不需要调用

$.validator.unobtrusive.parse，除非您正在使用新表单更新DOM，例如AJAX调用。在这种情况下，当您用新的表单元素替换DOM后，您应该在成功回调中调用它，以便解析新的不引人注目的验证规则

因此：

$("#process-payment").click(function (evt) {
    evt.preventDefault();
    ...
});

$('#card-payment').submit(function(evt) {
    evt.preventDefault();
    var form = $(this);
    if (form.valid()) {
        $.ajax({
            url: this.action,
            type: this.method,
            data: form.serialize(),
            success: function (result) {
                console.log(result);
            },
            error: function (jqXhr, textStatus, errorThrown) {
                alert("Error '" + jqXhr.status + "' (textStatus: '" + textStatus + "', errorThrown: '" + errorThrown + "')");
            },
            complete: function () {
                // $("#ProgressDialog").dialog("close");
            }
        });
    } else {
        console.log("invalid");
    }
});