Home » Disable button after click html in jQuery – prevent multiple clicks

Disable button after click html in jQuery – prevent multiple clicks

Today, We want to share with you Disable button after click html in jQuery – prevent multiple clicks.In this post we will show you Prevent Duplicate Form Submissions with jQuery, hear for jQuery disable submit button on click to prevent multiple form submits we will give you demo and example for implement.In this post, we will learn about javascript/jquery disable submit button on click, prevent double submitting with an example.

Disable button after click html in jQuery – prevent multiple clicks

There are the Following The simple About button after click html in jQuery – prevent multiple clicks Full Information With Example and source code.

Read Also:  jQuery AJAX Dynamic Treeview Menu using PHP, MySQL

As I will cover this Post with live Working example to develop how to disable submit button after form submission in php, so the how to disable submit button after form submission in javascript for this example is following below.

I short and sweet example for that, we can use simple bellow main your php file. We can see bellow full jquery Source code. We can also check this small and simple jquery source code as well as full code.

Read Also:  Lowercase Filter using Angular Example

small jquery code

$('#submitDataFrm').submit(function(){
    $("#saveCategoryID", this)
      .html("Loading........")
      .attr('disabled', 'disabled');
    return true;
});

Example:

index.html

<!DOCTYPE html>
<html>
<head>
    <title>javascript/jquery disable submit button on click, prevent double submitting</title>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
</head>
<body>
   <h1>Simple jQuery Form Submission Example</h1>
   <p>how to prevent multiple clicks on submit button in jquery.</p>
<form id="submitDataFrm">
    <input type="text" name="name" placeholder="Enetr your Name...">
    <input type="text" name="email" placeholder="Enetr Your Email...">
   
    <button type="submit" id="saveCategoryID">Submit</button>
</form>
   
<script type="text/javascript">
   
$('#submitDataFrm').submit(function(){
    $("#saveCategoryID", this)
      .html("Loading.......")
      .attr('disabled', 'disabled');
    return true;
});
   
</script>
   
</body>
</html>

Web Programming Tutorials Example with Demo

Read :

Read Also:  jQuery Capture Webcam Image Using Web Camera in PHP

Summary

You can also read about AngularJS, ASP.NET, VueJs, PHP.

I hope you get an idea about Disable button after click html in jQuery – prevent multiple clicks.
I would like to have feedback on my infinityknow.com blog.
Your valuable feedback, question, or comments about this article are always welcome.
If you enjoyed and liked this post, don’t forget to share.


Related FAQ

Here are some more FAQ related to this Article:

  1. Read Also:  Toggle Switches Laravel, Ajax and jQuery example
  2. Read Also:  jQuery Delete Confirm in Laravel 5.7 Example
  3. Read Also:  Jquery Ajax Laravel 5.8 Form Validation
  4. Read Also:  How to Check check php version command line linux
  5. Read Also:  Laravel 7 jQuery Ajax Form Validation Example
  6. Read Also:  What is the difference between let and var in Typescript
  7. Read Also:  jQuery Enable Disable Submit Button Example
  8. Read Also:  jQuery Disable Button After Click Example
  9. Read Also:  PHP Multidimensional Array Searching multiple values
  10. Read Also:  How to Check check php version command line linux

Leave a Comment

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