6 Answers
6

I don't think this is quite a duplicate of the answer referenced in the comment, since the link is for spring MVC, and this question is for .NET MVC.

I actually spent a few hours on this a while back, and came up with the following. This javascript hooks nicely with the unobtrusive jquery validation, and you can apply it to any form that has <input type="submit". Note that it uses jquery 1.7's on function:

The setTimeouts are needed. Otherwise, you could end up with a button that is disabled after clicked even when client-side validation fails. We have this in a global javascript file so that it is automatically applied to all of our forms.

Before, i try this out, i want to let you know that my application uses the jquery-1.5.1 as added by VS at the start. Replacing it with 1.7 version effect my application?
– Pankaj UpadhyayJan 6 '12 at 14:14

I can't say, but it shouldn't. If you want to stick with 1.5, you could just change on to live.
– danludwigJan 6 '12 at 14:18

6

This is good, but it should be mentioned that you could be using buttons, which this wouldn't find. If you are using both inputs and buttons, you would have to search both like, var button = $(this).find('input[type="submit"], button[type="submit"]');
– erosebeFeb 9 '15 at 21:32

I also like to use $(document.body).append("stuff"); in the setTimeout of the second .on and $(".whatever").remove(); in the setTimeout of the first .on to grey out the page and put a nice spinning gif in the middle with a friendly message for long-running operations like file uploads.
– nmit026Oct 12 '16 at 5:26

This method is clean and simple because it only disables the button if the client-side validation passed and it works on non-ajax forms since I don't have the luxury of time to refactor a bunch of non-ajax forms.
– TechSavvySamOct 30 '18 at 14:54

From the link you referenced -- The PRG pattern cannot address every scenario of duplicate form submission. Some known duplicate form submissions that PRG cannot solve are: ...if a web user clicks a submission button multiple times before the server response loads (may be prevented by using JavaScript to disable the button after the first click).
– danludwigJan 6 '12 at 14:32

You can use ajax.BeginForm insted of html.BeginForm to achieve this, if you use OnSuccess insted of OnBegin you can be sure that your method execute successful and after that your button turn to deactivate,with ajax you stay
in current view and you can update your current view instead of redirection