HTML5 Form Validation w/ jQuery Fallbacks


/ Published in: jQuery
Save to your folder(s)

Couple of ways to check if HTML5 form elements exist and use a fallback if they don't.


Copy this code and paste it in your HTML
  1. // don't forget this
  2. <script src="/jq/jquery.validate.js"></script>
  3. <script>
  4. jQuery(function() {
  5. if (!checkAttribute('input', 'required')) { // check for html5 validation
  6. jQuery("#form").validate(); // no? hey, use jQuery validate
  7. }
  8.  
  9. if (!checkAttribute('input', 'autofocus')) { // check for html5 validation
  10. document.getElementById("q").focus(); // no? hey, use jQuery focus()
  11. }
  12. });
  13.  
  14. function checkAttribute(element, attribute) { //the function
  15. var test = document.createElement(element);
  16. if (attribute in test) {
  17. return true;
  18. } else {
  19. return false;
  20. }
  21. }
  22. </script>

URL: http://diveintohtml5.org/forms.html

Report this snippet


Comments

RSS Icon Subscribe to comments

You need to login to post a comment.