Sometimes, we want to disable submit button on form submission with JavaScript.
In this article, we’ll look at how to disable submit button on form submission with JavaScript.
Disable the Submit Button on Form Submission with JavaScript
To disable submit button on form submission with JavaScript, we can listen to the submit event of the form.
Then we can set the disabled attribute of the submit button to true when we submit the form.
For instance, if we have the following HTML form:
<form>
<input>
<input type='submit'>
</form>
Then we can write the following JavaScript to disable the submit button when we submit the form with jQuery by writing:
$('form').submit(function() {
$(this).find(':input[type=submit]').prop('disabled', true);
});
We get the form with $(‘form’) .
Then we call submit on it with a callback to listen to the submit event of the form.
The callback we pass into submit get the submit button of the form with $(this).find(‘:input[type=submit]’) .
Then we call prop with 'disabled' and true to disable the form’s submit button.
Conclusion
To disable submit button on form submission with JavaScript, we can listen to the submit event of the form.
Then we can set the disabled attribute of the submit button to true when we submit the form.