Disable Submit Buttons on Form Submit

On my previous blog post I recommended that you be prepared for rigorous user interactions. In this blog I'm going to give you a simple yet very effective solution using jQuery and native JS to disable every button on every form when the user clicks on the submit button.

jQuery:

$(document).on('submit', 'form', function () {
    var $form = $(this);
    var $submits= $form.find(':submit');
    $submits.prop('disabled', true);
});

You should know that obviously this code applies the behaviour to all of the forms. So if you don't want to do this for all of the forms, consider using a custom class. For example add the dos class to your form (disable on submit) and then change the code to this:

$(document).on('submit', 'form.dos', function () {
    var $form = $(this);
    var $submits= $form.find(':submit');
    $submits.prop('disabled', true);
});