I have the following HTML and jquery:
<html dir="ltr" lang="en"> <head> </head> <body> <h2>Test disabling submit button for 1 minute...</h2> <br/> <p style="text-align:center"> <form id="yourFormId" name="yourFormId" method="post" action="#"> <input type="submit" class="submitBtn" value="I Accept"/> </form> </p> <!--script to disable the submit button --> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"> </script> <script type="text/javascript"> $(document).ready(function () { $(".submitBtn").click(function () { $(".submitBtn").attr("disabled", true); return true; }); }); </script> <!--script ends here--> </body> </html>
As its stands the submit button gets disabled when pressed. However once pressed it does not seem perform the submit. If I removed the jquery to disable the button, the button then performs the submit normally.
How can I disable the button only after it has performed the submit? the current jquery above seems to conflict with the submit operation.
Any suggestions to resolve this issue would be extremely helpful.
Enable / Disable submit button 1.1 To disable a submit button, you just need to add a disabled attribute to the submit button. $("#btnSubmit"). attr("disabled", true); 1.2 To enable a disabled button, set the disabled attribute to false, or remove the disabled attribute.
Just click f12 in your browser, find the submit button in the html, and then remove the disabled ! It will submit the form even if the inputs are empty.
Add the disable part in the submit event.
$(document).ready(function () { $("#yourFormId").submit(function () { $(".submitBtn").attr("disabled", true); return true; }); });
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With