CODEWITHSUNDEEP
jquery
Randy
Randy

Reputation: 131

disable submit button using jquery

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 ?

Upvotes: 12

Views: 61440

Answers (4)

Abhijit Maji
Abhijit Maji

Reputation: 1

$('#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>

Upvotes: 0

user1171884
user1171884

Reputation:

You can also disable the event like this,

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

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

}

Upvotes: 2

immayankmodi
immayankmodi

Reputation: 8580

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!

Upvotes: 3

Abhilash
Abhilash

Reputation: 1610

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();
}
...

Upvotes: 22

Related Questions