Ajax.BeginForm 在 chrome MVC 5 中不起作用答案

【问题标题】：Ajax.BeginForm not working in chrome MVC 5Ajax.BeginForm 在 chrome MVC 5 中不起作用
【发布时间】：2015-10-27 17:21:32
【问题描述】：

我目前正在尝试在 MVC 5 中实现 Ajax 表单。

@using (Ajax.BeginForm("Requirement", "Purchase", null, new AjaxOptions { OnSuccess = "redirectionClick", OnFailure = "Retry", HttpMethod = "POST" }, new { id = "RequirementForm", autocomplete = "off" }))
{
   //Various input fields
   @Html.AntiForgeryToken()
   <input type="submit" value="Submit" class="btn btn-primary EqualSized" id="SubmitBtn" style="width:30%">
   <input type="button" value="Reset" id="Reset" class="btn btn-primary EqualSized" style="width:30%">
}

script标签下的函数：

function CloseModals() {
    $('.modal').modal('hide');
    $('body').removeClass('modal-open');
    $('div.modal-backdrop').remove();
}

function redirectionClick() {
    CloseModals();
    bootbox.alert("Saved Successfully!");
    $.ajax({
        url: "@Url.Action("Requirement", "Purchase")",
        async: false,
        success: function (result) {
            $('#PageData').html(result);
        }
    })
}

function Retry() {
    alert('Unknown Error, Please try submitting the form again!');
    $('#SubmitBtn').attr('disabled', false);
}

$('#SubmitBtn').click(function () {
    if ($('#RequirementForm').valid())
        $(this).attr('disabled', true);
});

还有我的控制器：

[HttpPost]
[ValidateAntiForgeryToken]
public void Requirement(Requirement Details)
{
  //Logic
}

以上代码在 FireFox 和 IE 中有效，但在 Chrome 中无效。这里面有什么我遗漏的吗？

【问题讨论】：

为什么你有OnSuccess = "redirectionClick"，这意味着在提交到Requirement()方法之后，你再对同一个方法进行另一个ajax调用？
redirectionClick 是对控制器中 HttpGet 操作的调用。查看刷新的数据
那么为什么不直接使用UpdateTargetId 选项并在post 方法中返回部分呢？（这样做似乎是一种奇怪的方式 - 拨打 2 次电话而不是 1 次）
这样做是因为表单将处于模态。和更新直接导致的问题主窗口

标签： jquery ajax google-chrome asp.net-mvc-5 ajax.beginform

【解决方案1】：

如果提交按钮被禁用，我认为它不能提交表单，您的点击处理程序在您的提交处理程序之前触发。

尝试将您的点击处理程序更改为此

$('#SubmitBtn').click(function () {
    if ($('#RequirementForm').valid())
         $(this).prop('disabled', true).closest('form').submit();
});

另一种方法是处理表单上的提交，如果表单有效，则禁用其中的按钮。您可以为此使用 onbegin 或 submit 事件

【讨论】：

欢迎来到网络开发的世界，发现浏览器行为方式的差异并不少见
它有效 :-) 必须指定 return false;，因为表单在 IE 中提交了两次