how to disable save button using JQuery while the form is being submitted

Question

I have a data entry form as razor view in my MVC application. This view contains, some input controls, validators, and a submit button. when a user hits Submit button, it performs validations, and if any of them gets failed the user submit method gets terminated. When all validations are satisfied, the form gets submitted, but it takes a little more amount of time as some business logic gets executed. Now I do not want users to allow hitting submit button during this. And so Submit button should be disabled, and it should be re-enabled once the submit is completed.

How can I achieve this? I think I need to write JQuery for this, but not sure, which event to handle.

gdoron · Accepted Answer · 2013-03-01 06:45:52Z

5

Without seeing the HTML... or the javascript...

$('form').submit(function(){
    var $submit = $(this).find('input[type=submit]').prop('disabled', true);

    $.ajax({
        url: 'foo',
        //... the rest...

        complete: function(){
            $submit.prop('disabled', false);
        }
    });
})

answered Mar 1, 2013 at 6:45

gdoron

151k59 gold badges302 silver badges376 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Gjermund B. Dahl Over a year ago

This is a better practice than the accepted answer.

animuson · Accepted Answer · 2013-03-01 07:02:33Z

1

Try the following:

$("form").submit(function() {
    var form = this;
    setTimeout(function() {
       $(':submit', form).attr('disabled', true);
    }, 50)
});

edited Mar 1, 2013 at 7:02

animuson♦

54.9k28 gold badges142 silver badges150 bronze badges

answered Mar 1, 2013 at 6:45

SRy

2,9778 gold badges42 silver badges59 bronze badges

1 Comment

gdoron Over a year ago

And if it takes two seconds\minutes... hardcode time is problematic most of the times.

Collectives™ on Stack Overflow

how to disable save button using JQuery while the form is being submitted

2 Answers 2

1 Comment

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related