I’m starting to incorporate HTML5 stuff into the sites I code more and more and I ran into an odd problem with the popular jQuery form validation plugin. The “eager validation” (as soon as user input is valid, the error message is removed) would not work with HTML5 field types such as type="email" or type="tel" for instance.
Until the author updates his plugin, here’s a manual fix: in the plugin code, you’ll find a delegate() function (line 302 as of this writing). Inside the function, you’ll find something that look like that:
.validateDelegate(":text, :password, :file, select, textarea", "focusin focusout keyup", delegate)
All you have to do is add the new types manually using the jQuery Attribute Equals Selector syntax so that it looks like that:
.validateDelegate(":text, :password, :file, select, textarea, [type=number], [type=color], [type=tel], [type=url], [type=email], [type=date], [type=month], [type=week], [type=time], [type=datetime], [type=datetime-local]", "focusin focusout keyup", delegate)
That’s it!
You can also do the search and replace directly in the minified version or use jsmin to minify the updated version yourself…