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
    Introducing MooTools Templated

    One major problem with creating UI components with the MooTools JavaScript framework is that there isn't a great way of allowing customization of template and ease of node creation. As of today, there are two ways of creating: new Element Madness The first way to create UI-driven...

  • By
    Responsive and Infinitely Scalable JS Animations

    Back in late 2012 it was not easy to find open source projects using requestAnimationFrame() - this is the hook that allows Javascript code to synchronize with a web browser's native paint loop. Animations using this method can run at 60 fps and deliver fantastic...

Incredible Demos

  • By
    CSS Vertical Centering

    Front-end developing is beautiful, and it's getting prettier by the day. Nowadays we got so many concepts, methodologies, good practices and whatnot to make our work stand out from the rest. Javascript (along with its countless third party libraries) and CSS have grown so big, helping...

  • By
    Rotate Elements with CSS Transformations

    I've gone on a million rants about the lack of progress with CSS and how I'm happy that both JavaScript and browser-specific CSS have tried to push web design forward. One of those browser-specific CSS properties we love is CSS transformations. CSS transformations...