How to enable and disable submit button using jQuery?

To enable and disable submit button, use the jQuery prop() method. The prop() method gets or sets properties and values of the selected elements. When used with the disabled property, it can control whether a button is clickable or not.

Syntax

Here's the basic syntax for enabling and disabling buttons −

// To disable a button
$(selector).prop('disabled', true);

// To enable a button  
$(selector).prop('disabled', false);

Example

You can try to run the following code to enable and disable submit button using jQuery −

<!DOCTYPE html>
<html>
<head>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
    <script>
        $(document).ready(function() {
            $('#register').click(function() {
                // Disable the button immediately
                $(this).prop('disabled', true);
                $("#content").show();

                // Re-enable the button after 3 seconds
                setTimeout(function(){
                    $('#register').prop('disabled', false);
                    $("#content").hide();
                }, 3000);
            });
        });
    </script>
</head>
<body>
    <div id="btnregister" name="registerbtn">
        <input type="submit" value="Click me!" id="register" name="register"/>
    </div>

    <div style="display:none;" id="content">
        The above button disables for 3 seconds, on clicking.
    </div>
</body>
</html>

How It Works

In the above example −

  • When the submit button is clicked, $(this).prop('disabled', true) immediately disables it
  • The message div becomes visible using $("#content").show()
  • After 3000 milliseconds (3 seconds), the button is re-enabled with prop('disabled', false)
  • This prevents multiple form submissions and provides user feedback

This technique is commonly used to prevent double-clicking on forms and ensure better user experience during form processing.

Updated on: 2026-03-13T20:52:23+05:30

1K+ Views

Kickstart Your Career

Get certified by completing the course

Get Started
Advertisements