// Form Tooltip Validator /* author: scott lenger last updated: June 2008 instructions: 1. add link to this file 2. add setFormValidation(formid) where formid = the id of the form you want validated 3. add the appropriate class to the input tag (options are: text, email, phone, zip) 4. add class="required to input tag, forces field to be validated when the form is submitted Validations by: http://www.askthecssguy.com/2007/03/form_field_hints_with_css_and.html // Phone Validation modified from: http://www.dynamicajax.com/fr/Validating_Phone_Numbers_With_JavaScript-197_219_231_330.html // getElementsByClassName by Justin Diaz http://www.dustindiaz.com/getelementsbyclass/ */ // var formid = "validate"; // selects which form to target, used in findinputs and setFormValidation var hinttag = "p"; // choose which tag will contain the field hints // Get Class Function //////////////////////////////////////////////////////////////// // returns the class name of any xhtml tag function getElementsByClass(node,tag,searchClass) { var classElements = new Array(); if ( node == null ) node = document; if ( tag == null ) tag = '*'; var els = node.getElementsByTagName(tag); var elsLen = els.length; var pattern = new RegExp("(^|\\s)"+searchClass+"(\\s|$)"); for (i = 0, j = 0; i < elsLen; i++) { if ( pattern.test(els[i].className) ) { classElements[j] = els[i]; j++; } } return classElements; } // Validation Functions //////////////////////////////////////////////////////////////////// // Basic Text (requires more than 4 characters) class="text" function checkText(usrtxt) { var container = usrtxt.parentNode; var txt = usrtxt.value; if (txt.length > 1) { container.className = "valid"; } else { container.className = "notvalid"; } } // Email (requires & and . and at least 2 character extension) class="email" function checkEmail(usrtxt) { var container = usrtxt.parentNode; var txt = usrtxt.value; if (/^.+@[^\.].*\.[a-z]{2,}$/.test(txt)) { container.className = "valid"; } else { container.className = "notvalid"; } } // Zip (requires 5 digits) class="zip" function checkZip(usrtxt) { var container = usrtxt.parentNode; var num = usrtxt.value.replace(/[^\d]/g,''); if (num.length < 5){ container.className = "notvalid"; } else if (num.length > 4) { usrtxt.value = num.substring(0,5); container.className = "valid"; } } // Phone (requires 10 digits - US only) class="phone" function checkPhone(usrtxt) { var container = usrtxt.parentNode; var num = usrtxt.value.replace(/[^\d]/g,''); if (num.length < 3) { container.className = "notvalid"; } else if (num.length < 6) { usrtxt.value = num.substring(0,3) + "-" + num.substring(3,6); container.className = "notvalid"; } else if (num.length < 8) { usrtxt.value = num.substring(0,3) + "-" + num.substring(3, 6) + "-" + num.substring(6); container.className = "notvalid"; } else if (num.length > 9) { usrtxt.value = num.substring(0,3) + "-" + num.substring(3, 6) + "-" + num.substring(6, 10); container.className = "valid"; } else if (num.length > 8) { usrtxt.value = num.substring(0,3) + "-" + num.substring(3, 6) + "-" + num.substring(6, 10); container.className = "notvalid"; } } // checkCheckbox (determines if box is checked) class="checkbox" /*function checkCheckbox(usrtxt) { var container = usrtxt.parentNode; var checkbox = usrtxt.checked; if (checkbox != true) { container.className = "notvalid"; } else { container.className = "valid"; } }*/ // checkRadio // checkSelect // SUBMIT FORM AND VALIDATE ///////////////////////////////////////////////////////////////// // validates all required fields again before sending function formValidate(formid) { var reqfields = getElementsByClass(formid, "*", "required"); var errors = ""; for (var i=0; i