Submit Button Enabling

By  on  

"Enabling" you ask? Yes. We all know how to disable the submit upon form submission and the reasons for doing so, but what about re-enabling the submit button after an allotted amount of time. After all, what if the user presses the "stop" button immediately after submitting the form? They'd be screwed. Why not re-enable the submit button after an allotted amount of time so that the user may re-submit?

The MooTools JavaScript

window.addEvent('domready',function() {
		var subber = $('submit');
		subber.addEvent('click',function() {
			subber.set('value','Submitting...').disabled = true;
			(function() { subber.disabled = false; subber.set('value','Resubmit'); }).delay(10000); // how much time?  10 seconds
		});
	});

Of course, this isn't ideal in all situations. It is, however, a nice touch if your system can accommodate for it.

Update: Upon submission, the button's message changes to "submitting..." and once enabled, the message changes to "Resubmit." Thank you to Facundo Corradini for the suggestion!

Recent Features

  • By
    CSS @supports

    Feature detection via JavaScript is a client side best practice and for all the right reasons, but unfortunately that same functionality hasn't been available within CSS.  What we end up doing is repeating the same properties multiple times with each browser prefix.  Yuck.  Another thing we...

  • By
    Create a CSS Flipping Animation

    CSS animations are a lot of fun; the beauty of them is that through many simple properties, you can create anything from an elegant fade in to a WTF-Pixar-would-be-proud effect. One CSS effect somewhere in between is the CSS flip effect, whereby there's...

Incredible Demos

  • By
    Web Notifications API

    Every UI framework has the same set of widgets which have become almost essential to modern sites: modals, tooltips, button varieties, and notifications.  One problem I find is each site having their own widget colors, styles, and more -- users don't get a consistent experience.  Apparently the...

  • By
    Form Element AJAX Spinner Attachment Using MooTools

    Many times you'll see a form dynamically change available values based on the value of a form field. For example, a "State" field will change based on which Country a user selects. What annoys me about these forms is that they'll often do an...