jQuery Disable Submit Button Onclick to prevent form submit by Intecsols

In this post, I will try to teach you that “How to disable submit button on click to prevent form submit using jQuery”.

Normally, when you are making a page for your any site where you need to add form. You just add a form and it submits data to sever but sometimes you want to change it’s simple behavior with some special events. Might be you have to add some validations on frontend to do before posting or prevent user clicks. Because sometime users may click again and again or might be hacking attempts. Which will create multiple entries to the server and it is very bad practice. Every body needs to avoid these kind of attempts. So, you just want them to submit form once, after that you need to clear form by some validations.

So, the question comes in mind. How is it possible or how we achieve this kind of work ?

The solutions is very simple by some tricky jQuery scripts which is a library of Javascript.

I added an example to show you how can use bellow code and how you can see the result or you can practice it in fiddle.

jQuery Code:

$('#myFormId').submit(function(){

    $("#myButtonID", this)

      .html("Please Wait...")

      .attr('disabled', 'disabled');

    return true;

});

Here is a full example to see.

Example:

I am sure it helps you a-lot to figure out “How to disable submit button on click to prevent form submit using jQuery”. I will recommend if you find it useful then please share it with others by clicking on share button