Tuesday, October 13, 2009

Temporarily locking submit button

Suggested by this example.
I need a temporarily locking submit button because if there's a validation error on the page, the user needs to resubmit. But I need to stop the clickers (slow response sometimes on this server) and give them some feedback.

$(document).ready(function() {
$(':submit').click(function() {
$original = $(this).val();
$(this).val('Saving, please wait...')
.animate({opacity: 0.4}, 4000)
.fadeIn('slow', function() {
.animate({opacity: 1}, 2000)

My only problem is that it conflicts with the jquery validation plugin we're using: it prevents the error bubbles from displaying when submit is clicked.
If I can reference a validation value then I can check whether this function needs to execute or not.