If you’ve ever experimented with HTML5 Form Validation, you’ve probably been disappointed. The out-of-box experience isn’t quite what you want. Adding the required attribute to inputs works wonderfully. However the styling portion with input:invalid sorta sucks because empty inputs are trigger the :invalid state, even before the user has interacted with the page. I finally sat down and spent a couple days trying to make HTML5 Form Validation work the way I want it.
Want to add comments to your Statamic powered site? Try out Meerkat: a beautiful, full-featured comment system for Statamic. (sponsored link)
Native HTML5 form validation in 6 lines of code
Posted on | Freek Van der Herten