Submit Button Enabling
"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!
![Regular Expressions for the Rest of Us]()
Sooner or later you'll run across a regular expression. With their cryptic syntax, confusing documentation and massive learning curve, most developers settle for copying and pasting them from StackOverflow and hoping they work. But what if you could decode regular expressions and harness their power? In...
![Send Text Messages with PHP]()
Kids these days, I tell ya. All they care about is the technology. The video games. The bottled water. Oh, and the texting, always the texting. Back in my day, all we had was...OK, I had all of these things too. But I still don't get...
![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...
![CSS :target]()
One interesting CSS pseudo selector is :target. The target pseudo selector provides styling capabilities for an element whose ID matches the window location's hash. Let's have a quick look at how the CSS target pseudo selector works!
The HTML
Assume there are any number of HTML elements with...