表单验证后禁用 "submit" 按钮

Question

我有这样的表格

@using (Html.BeginForm("action", "controller", FormMethod.Post, new { id = "_identity" }))
{
// element here

 <input class="buttonblue" type="submit" value="Save" id="Submit1" />
}

通过Model验证。

一切正常。现在我想检测验证后控制器操作是否达到此请求。

实际上我想在控制器收到请求时禁用 submit button。

我试过跟随。但我认为这是不正确的。

 $('#_identity').submit(function () {
     $("#Submit1").val("Saving...");
     $("#Submit1").attr('disabled', 'disabled');
 });

这在请求到达控制器之前和验证之前被调用。

我想要简单的事情，如果表单被验证并且请求到达控制器然后用户不能再次点击提交按钮。

Answer 1

这样使用Ajax.BeginForm：

@using (Ajax.BeginForm("action", "controller", new AjaxOptions{ HttpMethod ="Post",OnBegin ="OnBegin",OnSuccess="OnSuccess",OnFailure="OnFailure"},new { id = "_identity" }))
{
// element here

 <input class="buttonblue" type="submit" value="Save" id="Submit1" />
}

和 js :

<script type="text/javascript">

    function OnBegin() {

        // disable submit button here
    }

    function OnSuccess() {

        // enable submit button here
    }

    function OnFailure() {

        // enable submit button in case of failure
    }

</script>

Answer 2

我已经解决了。

正在使用

  $('#_identity').submit(function () {
            if ($(this).valid()) {
                $(':submit', this).attr('disabled', 'disabled');
                $(':submit', this).val('Saving...');
            }
        });

找到了Here

表单验证后禁用 "submit" 按钮

Disable "submit" button after form validation

jquery

forms

asp.net-mvc-4

form-submit