»
EnglishFrenchVietnamese

Print - RegExp Validation - JavaScriptBank.com

Full version: jsB@nk » Form » Validation » RegExp Validation
URL: https://www.javascriptbank.com/regexp-validation.html

RegExp Validation © JavaScriptBank.comUse this JavaScript for form validation using regular expressions. None of the information submitted in the form is saved. Very extensive.

Full version: jsB@nk » Form » Validation » RegExp Validation
URL: https://www.javascriptbank.com/regexp-validation.html



CSS
<style type="text/css">.required {  color: red;}</style><!--    This script downloaded from www.JavaScriptBank.com    Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->


JavaScript
<script language="javascript">// Created by: Travis Beckham :: http://www.squidfingers.com | http://www.podlob.com// |||||||||||||||||||||||||||||||||||||||||||||||||||||//// Coded by Travis Beckham// http://www.squidfingers.com | http://www.podlob.com// If want to use this code, feel free to do so, but// please leave this message intact.//// |||||||||||||||||||||||||||||||||||||||||||||||||||||// --- version date: 11/21/02 --------------------------// returns true if the string is emptyfunction isEmpty(str){  return (str == null) || (str.length == 0);}// returns true if the string is a valid emailfunction isEmail(str){  if(isEmpty(str)) return false;  var re = /^[^\s()<>@,;:\/]+@\w[\w\.-]+\.[a-z]{2,}$/i  return re.test(str);}// returns true if the string only contains characters A-Z or a-zfunction isAlpha(str){  var re = /[^a-zA-Z]/g  if (re.test(str)) return false;  return true;}// returns true if the string only contains characters 0-9function isNumeric(str){  var re = /[\D]/g  if (re.test(str)) return false;  return true;}// returns true if the string only contains characters A-Z, a-z or 0-9function isAlphaNumeric(str){  var re = /[^a-zA-Z0-9]/g  if (re.test(str)) return false;  return true;}// returns true if the string's length equals "len"function isLength(str, len){  return str.length == len;}// returns true if the string's length is between "min" and "max"function isLengthBetween(str, min, max){  return (str.length >= min)&&(str.length <= max);}// returns true if the string is a US phone number formatted as...// (000)000-0000, (000) 000-0000, 000-000-0000, 000.000.0000, 000 000 0000, 0000000000function isPhoneNumber(str){  var re = /^\(?[2-9]\d{2}[\)\.-]?\s?\d{3}[\s\.-]?\d{4}$/  return re.test(str);}// returns true if the string is a valid date formatted as...// mm dd yyyy, mm/dd/yyyy, mm.dd.yyyy, mm-dd-yyyyfunction isDate(str){  var re = /^(\d{1,2})[\s\.\/-](\d{1,2})[\s\.\/-](\d{4})$/  if (!re.test(str)) return false;  var result = str.match(re);  var m = parseInt(result[1]);  var d = parseInt(result[2]);  var y = parseInt(result[3]);  if(m < 1 || m > 12 || y < 1900 || y > 2100) return false;  if(m == 2){          var days = ((y % 4) == 0) ? 29 : 28;  }else if(m == 4 || m == 6 || m == 9 || m == 11){          var days = 30;  }else{          var days = 31;  }  return (d >= 1 && d <= days);}// returns true if "str1" is the same as the "str2"function isMatch(str1, str2){  return str1 == str2;}// returns true if the string contains only whitespace// cannot check a password type input for whitespacefunction isWhitespace(str){ // NOT USED IN FORM VALIDATION  var re = /[\S]/g  if (re.test(str)) return false;  return true;}// removes any whitespace from the string and returns the result// the value of "replacement" will be used to replace the whitespace (optional)function stripWhitespace(str, replacement){// NOT USED IN FORM VALIDATION  if (replacement == null) replacement = '';  var result = str;  var re = /\s/g  if(str.search(re) != -1){    result = str.replace(re, replacement);  }  return result;}// validate the formfunction validateForm(f, preCheck){  var errors = '';  if(preCheck != null) errors += preCheck;  var i,e,t,n,v;  for(i=0; i < f.elements.length; i++){    e = f.elements[i];    if(e.optional) continue;    t = e.type;    n = e.name;    v = e.value;    if(t == 'text' || t == 'password' || t == 'textarea'){      if(isEmpty(v)){        errors += n+' cannot be empty.\n'; continue;      }      if(v == e.defaultValue){        errors += n+' cannot use the default value.\n'; continue;      }      if(e.isAlpha){        if(!isAlpha(v)){          errors += n+' can only contain characters A-Z a-z.\n'; continue;        }      }      if(e.isNumeric){        if(!isNumeric(v)){          errors += n+' can only contain characters 0-9.\n'; continue;        }      }      if(e.isAlphaNumeric){        if(!isAlphaNumeric(v)){          errors += n+' can only contain characters A-Z a-z 0-9.\n'; continue;        }      }      if(e.isEmail){        if(!isEmail(v)){          errors += v+' is not a valid email.\n'; continue;        }      }      if(e.isLength != null){        var len = e.isLength;        if(!isLength(v,len)){          errors += n+' must contain only '+len+' characters.\n'; continue;        }      }      if(e.isLengthBetween != null){        var min = e.isLengthBetween[0];        var max = e.isLengthBetween[1];        if(!isLengthBetween(v,min,max)){          errors += n+' cannot contain less than '+min+' or more than '+max+' characters.\n'; continue;        }      }      if(e.isPhoneNumber){        if(!isPhoneNumber(v)){          errors += v+' is not a valid US phone number.\n'; continue;        }      }      if(e.isDate){        if(!isDate(v)){          errors += v+' is not a valid date.\n'; continue;        }      }      if(e.isMatch != null){        if(!isMatch(v, e.isMatch)){          errors += n+' does not match.\n'; continue;        }      }    }    if(t.indexOf('select') != -1){      if(isEmpty(e.options[e.selectedIndex].value)){        errors += n+' needs an option selected.\n'; continue;      }    }    if(t == 'file'){      if(isEmpty(v)){        errors += n+' needs a file to upload.\n'; continue;      }    }  }  if(errors != '') alert(errors);  return errors == '';}/*The following elements are not validated...button   type="button"checkbox type="checkbox"hidden   type="hidden"radio    type="radio"reset    type="reset"submit   type="submit"All elements are assumed required and will only be validated for anempty value or defaultValue unless specified by the following properties.isEmail = true;          // valid email addressisAlpha = true;          // A-Z a-z characters onlyisNumeric = true;        // 0-9 characters onlyisAlphaNumeric = true;   // A-Z a-z 0-9 characters onlyisLength = number;       // must be exact lengthisLengthBetween = array; // [lowNumber, highNumber] must be between lowNumber and highNumberisPhoneNumber = true;    // valid US phone number. See "isPhoneNumber()" comments for the formatting rulesisDate = true;           // valid date. See "isDate()" comments for the formatting rulesisMatch = string;        // must match stringoptional = true;         // element will not be validated*/// ||||||||||||||||||||||||||||||||||||||||||||||||||// --------------------------------------------------// ||||||||||||||||||||||||||||||||||||||||||||||||||// All of the previous JavaScript is coded to process// any form and should be kept in an external file if// multiple forms are being processed.// This function configures the previous// form validation code for this form.function configureValidation(f){  f.firstname.isAlphaNumeric = true;  f.lastname.isAlphaNumeric = true;  f.email.isEmail = true;  f.phone.isPhoneNumber = true;  f.birthday.isDate = true;  f.password1.isLengthBetween = [4,255];  f.password2.isMatch = f.password1.value;  f.comments.optional = true;  var preCheck = (!f.infohtml.checked && !f.infocss.checked && !f.infojs.checked) ? 'select at least one checkbox.\n' : null;  return validateForm(f, preCheck);}</script><!--    This script downloaded from www.JavaScriptBank.com    Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->


HTML
<form action="#" method="post" onsubmit="return configureValidation(this)" onreset="confirm('All form information will be erased.')">    <table class="formtable">      <tr>        <td>First Name: <span class="required">*</span></td>        <td><input type="text" name="firstname" value="" class="text"></td>      </tr>      <tr>        <td>Last Name: <span class="required">*</span></td>        <td><input type="text" name="lastname" value="" class="text"></td>      </tr>      <tr>        <td>Email: <span class="required">*</span></td>        <td><input type="text" name="email" value="" class="text"></td>      </tr>      <tr>        <td>Email Preferred: <span class="required">*</span></td>        <td><select name="emailpreferred">          <option value="text">Text</option>          <option value="html">HTML</option>          <option value="flash">Flash</option>        </select></td>      </tr>      <tr>        <td>Phone: (US only) <span class="required">*</span></td>        <td><input type="text" name="phone" value="(000) 000-0000" class="text"></td>      </tr>      <tr>        <td>Birthday: <span class="required">*</span></td>        <td><input type="text" name="birthday" value="mm/dd/yyyy" class="text"></td>      </tr>      <tr>        <td>Gender:</td>        <td>Male: <input type="radio" name="gender" value="male" class="radio" checked="checked"> Female: <input type="radio" name="gender" value="female" class="radio"></td>      </tr>      <tr>        <td>Password1: <span class="required">*</span></td>        <td><input type="password" name="password1" value="" class="text"></td>      </tr>      <tr>        <td>Password2: <span class="required">*</span></td>        <td><input type="password" name="password2" value="" class="text"></td>      </tr>      <tr>        <td colspan="2">Select one or more of the following: <span class="required">*</span></td>      </tr>      <tr>        <td colspan="2">HTML: <input type="checkbox" name="infohtml" value="true" class="checkbox"> CSS: <input type="checkbox" name="infocss" value="true" class="checkbox"> JavaScript: <input type="checkbox" name="infojs" value="true" class="checkbox"></td>      </tr>      <tr>        <td>Comments:</td>        <td><textarea name="comments" value="" class="text" cols="20" rows="4"></textarea></td>      </tr>      <tr>        <td colspan="2"><hr></td>      </tr>      <tr>        <td colspan="2" align="center"><input type="submit" name="submit" value="Submit" class="button"> <input type="reset" name="reset" value="Reset" class="button"></td>      </tr>    </table>  </form><!--    This script downloaded from www.JavaScriptBank.com    Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->