block button on submit form

Question

Trying to avoid multiple submission on submit button click using attribute disabled, but on click it just block the button and nothing happens. Have tried to add id to Html.Begin form, but on click it gives server application error like : the parameters dictionary contains a null entry for parameter 'id' of non-nullable type System.Int32

@using (Html.BeginForm(MVC.Controller.MethodName(), FormMethod.Post, new { id = "submitFormId" }))


 <button class="btn btn-w-m btn-primary" type="button" id="submitButtonId" value="AddSmth" onclick="return validateForm(event)">
   <i class="fa fa-plus"></i>&nbsp;Add
 </button>

And js:

 $("#submitButtonId").attr("disabled",true);
 $('#submitFormId').submit();

Answer 1

The proplem is you want an id parameter in your URL but you don't supply one. Fore example:

https://example.com/controller/edit/1
                                    ^^ missing

The 1 (id) is missing.

Answer 2

It is not possible because when you press the button that time reload page so that disable attribute is removed

If you want to set this condition, then use ajax so page is not reloaded and then the button disable is also working

Answer 3

Founded another way to prevent multiple click on the button. Just added :

@{ Html.EnableClientValidation(); }
@{ Html.EnableUnobtrusiveJavaScript(); }

To the view, and after added global variable var isSubmited = false;, then validating it by:

if (isSubmited) e.PreventDefault();

. . .

if ($('#submitFormId').valid()) {
            isSubmited = true;
        }