Categories
JavaScript Answers

How to Disable the Submit Button on Form Submission with JavaScript and jQuery?

Spread the love

To disable submit button on form submission with JavaScript and jQuery, 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.

By John Au-Yeung

Web developer specializing in React, Vue, and front end development.

Leave a Reply

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