jQuery disable submit button on click to prevent multiple form submits

jQuery disable submit button on click to prevent multiple form submits

In this post we will give you information about jQuery disable submit button on click to prevent multiple form submits. Hear we will give you detail about jQuery disable submit button on click to prevent multiple form submitsAnd how to use it also give you demo for it if it is necessary.

In this small post, we will lean how to disable button on click to prevent multiple form submits in jquery. we can stop duplicate form submission using jquery. we can easily disabled button on click event in jquery for prevent duplicate form submit.

Sometime we are working with php or any framework like laravel codeigniter and you used form with one submit button. we have form is large and big than maybe take time to submitting process so user can click many times but actual form submit again and again.

So we must have to prevent multiple form submits like prevent double click on submit button. so how we can prevent this. we can do it using jquery. when you click on submit button than it should be disabled so it’s click again.

I written example for that, you can use bellow php file. you can see bellow full code. You can also check this small jquery code and full code.

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

$("#myButtonID", this)

.html("Please Wait...")

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

return true;

});

Here is a full example, you can see.

Example:

<!DOCTYPE html>

<html>

<head>

<title>jQuery disable submit button on click to prevent multiple form submits - ItSolutionStuff.com</title>

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>

</head>

<body>

<form id="myFormId">

<input type="text" name="name" placeholder="Name...">

<input type="text" name="email" placeholder="Email...">

<button type="submit" id="myButtonID">Submit</button>

</form>

<script type="text/javascript">

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

$("#myButtonID", this)

.html("Please Wait...")

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

return true;

});

</script>

</body>

</html>

I hope it can help you…

Hope this code and post will helped you for implement jQuery disable submit button on click to prevent multiple form submits. if you need any help or any feedback give it in comment section or you have good idea about this post you can give it comment section. Your comment will help us for help you more and improve us. we will give you this type of more interesting post in featured also so, For more interesting post and code Keep reading our blogs

For More Info See :: laravel And github

Leave a Comment

Your email address will not be published. Required fields are marked *

  +  3  =  4

We accept paid advance and paid guest Posting on our Site : Contact US