jquery to disable buttons when clicked.js

// in case using alongside prototype
var $j = jQuery.noConflict();

$j(document).ready(function()
{
	// apply the disable onclick for buttons with css class of 'disable-on-click'
	$j(".disable-on-click").bind('click', function(e) {
		$j(this).attr("disabled", "true").attr("value", "Please wait...");
	});		
}

// if you need to re-enable a button 
$j("#my_button").removeAttr('disabled').attr("value", "Submit");

// or all with a specific css class i.e. 'disable-on-click'
$j(".disable-on-click").each(function(e) {
	// remove attribute and reset the display text for the button to 'Submit'
	$j(this).removeAttr('disabled').attr("value", "Submit");
});	

// UPDATE: this is more correct - (disabled = disabled) vs (disabled = true)
$j(this).attr("disabled", "disabled");

// and for Safari/Chrome (webkit browsers) a manual submit is needed
// after disabling the button
this.form.submit(); // note 'this' is the submit button in this case

// ***************************
// an alternate approach, disable the button when the form submits
// this is good in many situations but not all
$j(".disable-on-click").each( function() {		
	var thisButton = this;
	$j(this.form).bind('submit', function(e) {			
		$j(thisButton).attr("disabled", "disabled").attr("value", "Please wait...");
	});
});