disable submit button using jquery

Question

I want to disable submit button in my form once it s clicked to restrict user to click it again and again i tried this with jquery

$('form').submit(function()
{  
    var formId = this.id;
    if (formId != ''){
        $('#'+formId+' :input[type=submit]').attr('disabled',true);
        this.submit();
    }
});

my problem s that i have two submit button s in my page which i m checking in controller to direct but i m not getting any post values once i disable the submit button in my form. Is there any other way to prevent user to restrict multiple clicks ?

possible duplicate of [how to disable submit button with jquery](http://stackoverflow.com/questions/1237896/how-to-disable-submit-button-with-jquery) — dwitvliet, Jul 13 '14 at 15:23

score 22 · Accepted Answer · answered Nov 02 '12 at 12:12

22

Have an id or a name for the submit button. Disable that button only

For example:

HTML

<form id="frm_name">
     <input type="submit" id="btn_submit" value="Submit" />
</form>

jQuery

...
if (formId != ''){
    $('#btn_submit').attr('disabled',true);
    this.submit();
}
...

answered Nov 02 '12 at 12:12

Abhilash

1,610
9
19

s this will solve my problem as this s the commonfunction which i want to call all over my app i can call this function in onsubmit of each button with formid and disable field parmeter – Randy Nov 05 '12 at 04:53

immayankmodi · Answer 2 · 2015-04-16T14:25:28.403

3

In my case $('#btn_submit').prop("disabled", true); worked!

Update:

I was using kendo grid inside some specific rows I want to disable Edit and Delete inline buttons. I tried many alternate ways to disable it but .prop() worked like charm!

edited Apr 16 '15 at 14:25

answered Apr 16 '15 at 12:01

immayankmodi

8,210
9
38
55

This is in the low quality posts queue. I'm voting it looks okay, but you should add some more information about why this works when the OP's attempts didn't. – Kelderic Apr 16 '15 at 12:40

score 2 · Answer 3 · edited Jan 22 '19 at 11:22

2

You can also disable the event like this,

$('form').submit(function(e)
{ 

e.preventDefault();
//then carry out another way of submitting the content.

}

edited Jan 22 '19 at 11:22

Reema Parakh

1,347
3
19
46

answered Nov 02 '12 at 12:22

score 0 · Answer 4 · answered Jun 28 '22 at 10:03

$('#submit_button_1').prop('disabled', true);
$('#submit_button_2').prop('disabled', true);

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="button" id="submit_button_1" value="Submit" />
<button type="submit" id="submit_button_2">Submit</button>

disable submit button using jquery

4 Answers4

Linked