表单验证后禁用“提交”按钮

时间:2022-11-24 10:56:00

I have a form like this

我有这样的表格

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

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

It is validate by Model.

它由Model验证。

It's working fine. And now I want to detect if this request is reached at controller action after validate.

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

Actually I want to disable submit button when request is reached at controller.

实际上我想在控制器上达到请求时禁用提交按钮。

I have tried following. But I think this is not correct.

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

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

This is called before request reached at controller and before validate.

在控制器和验证之前到达请求之前调用此方法。

I want simple thing if form is validated and request reached at controller then user can't hit submit button again.

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

2 个解决方案

#1


2  

I have resolved this.

我已经解决了这个问题

Using

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

I have found it Here

我在这里找到了它

#2


0  

Use Ajax.BeginForm this way:

以这种方式使用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" />
}

and js :

和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>

#1


2  

I have resolved this.

我已经解决了这个问题

Using

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

I have found it Here

我在这里找到了它

#2


0  

Use Ajax.BeginForm this way:

以这种方式使用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" />
}

and js :

和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>