Question

我想在mvc razor中使用ajax帖子发布我的表单。我试图在发布到数据库之前验证表单。但即使表单有效，它也会阻止表单发布。

$(function () {
    $('#MyForm').submit(function () {
        if ($('#MyForm').valid()) {
        //$("#divLoading").show();
        $.ajax({
            type: "POST",
            url: '@Url.Action("Something", "Something")',
            data: $('#MyForm').serialize(),
            dataType: 'json',
            error: function (xhr) {
                $("#Message").text(xhr.statusText);
                $('#divLoading').hide('fast');
            },
            success: function (result) {
                //$('#divLoading').hide('fast');
                if (result.IsSuccess) {
                    $("#Message").html(result.Message);
                    $('#MyForm')[0].reset();
                }
            }
        });
        }
    });
});

开始表单包含

@using (Ajax.BeginForm("Something", "Something", new AjaxOptions { InsertionMode = InsertionMode.Replace, HttpMethod = "POST" }, new { @id = "MyForm" }))
{
}

先谢谢

Answer 1

您的问题是您仍然使用表单默认操作，因此页面将在获取ajax响应之前重新加载。试试这个：

$('#MyForm').submit(function (event) {
event.preventDefault();

if ($('#MyForm').valid()) {
    //$("#divLoading").show();
    $.ajax({
        type: "POST",
        url: '@Url.Action("Something", "Something")',
        data: $('#MyForm').serialize(),
        dataType: 'json',
        error: function (xhr) {
            $("#Message").text(xhr.statusText);
            $('#divLoading').hide('fast');
        },
        success: function (result) {
            //$('#divLoading').hide('fast');
            if (result.IsSuccess) {
                $("#Message").html(result.Message);
                $('#MyForm')[0].reset();
            }
        }
    });
}

这就是区别：

$('#MyForm').submit(function (event) {
    event.preventDefault();

$（＆＃39;＃MyForm＆＃39;）。valid（）总是返回false

1 个答案: