Here is the JS code
function Validate(objForm) {
var arrValidated = new Array();
for (var i = 0; i < objForm.elements.length; i++) {
var element = objForm.elements[i];
var elName = element.name;
if ((!elName) || (elName.length == 0) || (arrValidated[elName]))
continue;
arrValidated[elName] = true;
var validationType = element.getAttribute("validate");
if ((!validationType) || (validationType.length == 0))
continue;
var strMessages = element.getAttribute("msg");
if (!strMessages)
strMessages = "";
var arrMessages = strMessages.split("|");
var arrValidationTypes = validationType.split("|");
for (var j = 0; j < arrValidationTypes.length; j++) {
var curValidationType = arrValidationTypes[j];
var blnValid = true;
switch (curValidationType) {
case "not_empty":
blnValid = ValidateNotEmpty(element);
break;
case "integer":
blnValid = ValidateInteger(element);
break;
case "number":
blnValid = ValidateNumber(element);
break;
case "email":
blnValid = ValidateEmail(element);
break;
case "phone":
blnValid = ValidatePhone(element);
break;
default:
try {
blnValid = eval(curValidationType + "(element)");
}
catch (ex) {
blnValid = true;
}
}
if (blnValid == false) {
var message = "invalid value for " + element.name;
if ((j < arrMessages.length) && (arrMessages[j].length > 0))
message = arrMessages[j];
InsertError(element, message);
if ((typeof element.focus == "function") || (element.focus)) {
element.focus();
}
return false;
}
else
ClearError(element);
}
}
return true;
}
//Empty Validation
function ValidateNotEmpty(objElement) {
var strValue = GetElementValue(objElement);
var blnResult = true;
if (allTrim(strValue) == "") //check for nothing
{
blnResult = false;
}
return blnResult;
}
//Integer Validation
function ValidateInteger(objElement) {
var strString = GetElementValue(objElement);
var strValidChars = "0123456789";
var strChar;
var blnResult = true;
for (i = 0; i < strString.length && blnResult == true; i++) {
strChar = strString.charAt(i);
if (strValidChars.indexOf(strChar) == -1) {
blnResult = false;
}
}
return blnResult;
}
//Number Validation
function ValidateNumber(objElement)
// check for valid numeric strings
{
var strString = GetElementValue(objElement);
var strValidChars = ".0123456789"; //decimal ok
var strChar;
var blnResult = true;
for (i = 0; i < strString.length && blnResult == true; i++) {
strChar = strString.charAt(i);
if (strValidChars.indexOf(strChar) == -1) {
blnResult = false;
}
}
return blnResult;
}
//Email Validation
function ValidateEmail(objElement) {
// Will check for @, period after @ and text in between
var strValue = GetElementValue(objElement);
var in_space = strValue.indexOf(" ");
if (in_space != -1)
{ return false; }
var len = strValue.length;
var alpha = strValue.indexOf("@");
var last_alpha = strValue.lastIndexOf("@");
if (alpha != last_alpha)
{ return false; }
// No @, in first position, or name too short
if (alpha == -1 || alpha == 0 || len < 6)
{ return false; }
var last_p = strValue.lastIndexOf(".");
// Be sure period at least two spaces after @, but not last char.
if (last_p - alpha < 2 || last_p == (len - 1))
{ return false; }
}
//Valid PhoneNumber
function ValidatePhone(objElement) {
// non-digit characters which are allowed in phone numbers
var phoneNumberDelimiters = "()- ";
// characters which are allowed in international phone numbers
// (a leading + is OK)
var validWorldPhoneChars = phoneNumberDelimiters + "+";
// Minimum no of digits in an international phone no.
var minDigitsInIPhoneNumber = 10;
var strValue = GetElementValue(objElement);
s = stripCharsInBag(strValue, validWorldPhoneChars);
return (ValidateInteger(s) && s.length >= minDigitsInIPhoneNumber);
}
function GetElementValue(objElement) {
var result = "";
switch (objElement.type) {
case "text":
case "hidden":
case "textarea":
case "password":
result = objElement.value;
break;
case "select-one":
case "select":
if (objElement.selectedIndex >= 0)
result = objElement.options[objElement.selectedIndex].value;
break;
case "radio":
case "checkbox":
for (var i = 0; i < objElement.form.elements.length; i++) {
if (objElement.form.elements[i].name == objElement.name) {
if (objElement.form.elements[i].checked)
result += objElement.form.elements[i].value + ",";
}
}
break;
}
return result;
}
function InsertError(element, strMessage) {
if ((element.form.getAttribute("show_alert")) && (element.form.getAttribute("show_alert") != "0")) {
alert(strMessage);
return;
}
var strSpanID = element.name + "_val_error";
var objSpan = document.getElementById(strSpanID);
if (!objSpan) {
if ((element.type == "radio") || (element.type == "checkbox")) {
for (var i = 0; i < element.form.elements.length; i++) {
if (element.form.elements[i].name == element.name) {
element = element.form.elements[i];
}
}
}
objSpan = document.createElement("span");
objSpan.id = strSpanID;
objSpan.className = "validation_error";
var nodeAfter = 0;
var nodeParent = element.parentNode;
for (var i = 0; i < nodeParent.childNodes.length; i++) {
if (nodeParent.childNodes[i] == element) {
if (i < (nodeParent.childNodes.length - 1))
nodeAfter = nodeParent.childNodes[i + 1];
break;
}
}
if ((!nodeAfter) && (nodeParent.parentNode)) {
nodeParent = nodeParent.parentNode;
for (var i = 0; i < nodeParent.childNodes.length; i++) {
if (nodeParent.childNodes[i] == element.parentNode) {
if (i < (nodeParent.childNodes.length - 1))
nodeAfter = nodeParent.childNodes[i + 1];
break;
}
}
}
if (nodeAfter)
nodeParent.insertBefore(objSpan, nodeAfter);
else
document.body.appendChild(objSpan);
}
objSpan.innerHTML = strMessage;
}
function ClearError(element) {
var strSpanID = element.name + "_val_error";
var objSpan = document.getElementById(strSpanID);
if (objSpan) {
objSpan.innerHTML = "";
}
}
function allTrim(cValue) {
var lDone = false;
while (lDone == false) {
if (cValue.length == 0) { return cValue; }
if (cValue.indexOf(' ') == 0) { cValue = cValue.substring(1); lDone = false; continue; }
else { lDone = true; }
if (cValue.lastIndexOf(' ') == cValue.length - 1) { cValue = cValue.substring(0, cValue.length - 1); lDone = false; continue; }
else { lDone = true; }
}
return cValue;
}
function stripCharsInBag(s, bag) {
var i;
var returnString = "";
// Search through string’s characters one by one.
// If character is not in bag, append to returnString.
for (i = 0; i < s.length; i++) {
// Check that current character isn’t whitespace.
var c = s.charAt(i);
if (bag.indexOf(c) == -1) returnString += c;
}
return returnString;
}
HTML :
<form action="JsValidation.aspx" show_alert="1" onSubmit="return Validate(this);">
First Name <input type="Text" name="FirstName" maxlength="25" validate="not_empty" msg="First Name is Required" /><br/>
Email <input type="text" name="Email" maxlength="25" validate="email" msg="Email is Required" /><br/>
<input type="submit" value="Go">
</form>
function Validate(objForm) {
var arrValidated = new Array();
for (var i = 0; i < objForm.elements.length; i++) {
var element = objForm.elements[i];
var elName = element.name;
if ((!elName) || (elName.length == 0) || (arrValidated[elName]))
continue;
arrValidated[elName] = true;
var validationType = element.getAttribute("validate");
if ((!validationType) || (validationType.length == 0))
continue;
var strMessages = element.getAttribute("msg");
if (!strMessages)
strMessages = "";
var arrMessages = strMessages.split("|");
var arrValidationTypes = validationType.split("|");
for (var j = 0; j < arrValidationTypes.length; j++) {
var curValidationType = arrValidationTypes[j];
var blnValid = true;
switch (curValidationType) {
case "not_empty":
blnValid = ValidateNotEmpty(element);
break;
case "integer":
blnValid = ValidateInteger(element);
break;
case "number":
blnValid = ValidateNumber(element);
break;
case "email":
blnValid = ValidateEmail(element);
break;
case "phone":
blnValid = ValidatePhone(element);
break;
default:
try {
blnValid = eval(curValidationType + "(element)");
}
catch (ex) {
blnValid = true;
}
}
if (blnValid == false) {
var message = "invalid value for " + element.name;
if ((j < arrMessages.length) && (arrMessages[j].length > 0))
message = arrMessages[j];
InsertError(element, message);
if ((typeof element.focus == "function") || (element.focus)) {
element.focus();
}
return false;
}
else
ClearError(element);
}
}
return true;
}
//Empty Validation
function ValidateNotEmpty(objElement) {
var strValue = GetElementValue(objElement);
var blnResult = true;
if (allTrim(strValue) == "") //check for nothing
{
blnResult = false;
}
return blnResult;
}
//Integer Validation
function ValidateInteger(objElement) {
var strString = GetElementValue(objElement);
var strValidChars = "0123456789";
var strChar;
var blnResult = true;
for (i = 0; i < strString.length && blnResult == true; i++) {
strChar = strString.charAt(i);
if (strValidChars.indexOf(strChar) == -1) {
blnResult = false;
}
}
return blnResult;
}
//Number Validation
function ValidateNumber(objElement)
// check for valid numeric strings
{
var strString = GetElementValue(objElement);
var strValidChars = ".0123456789"; //decimal ok
var strChar;
var blnResult = true;
for (i = 0; i < strString.length && blnResult == true; i++) {
strChar = strString.charAt(i);
if (strValidChars.indexOf(strChar) == -1) {
blnResult = false;
}
}
return blnResult;
}
//Email Validation
function ValidateEmail(objElement) {
// Will check for @, period after @ and text in between
var strValue = GetElementValue(objElement);
var in_space = strValue.indexOf(" ");
if (in_space != -1)
{ return false; }
var len = strValue.length;
var alpha = strValue.indexOf("@");
var last_alpha = strValue.lastIndexOf("@");
if (alpha != last_alpha)
{ return false; }
// No @, in first position, or name too short
if (alpha == -1 || alpha == 0 || len < 6)
{ return false; }
var last_p = strValue.lastIndexOf(".");
// Be sure period at least two spaces after @, but not last char.
if (last_p - alpha < 2 || last_p == (len - 1))
{ return false; }
}
//Valid PhoneNumber
function ValidatePhone(objElement) {
// non-digit characters which are allowed in phone numbers
var phoneNumberDelimiters = "()- ";
// characters which are allowed in international phone numbers
// (a leading + is OK)
var validWorldPhoneChars = phoneNumberDelimiters + "+";
// Minimum no of digits in an international phone no.
var minDigitsInIPhoneNumber = 10;
var strValue = GetElementValue(objElement);
s = stripCharsInBag(strValue, validWorldPhoneChars);
return (ValidateInteger(s) && s.length >= minDigitsInIPhoneNumber);
}
function GetElementValue(objElement) {
var result = "";
switch (objElement.type) {
case "text":
case "hidden":
case "textarea":
case "password":
result = objElement.value;
break;
case "select-one":
case "select":
if (objElement.selectedIndex >= 0)
result = objElement.options[objElement.selectedIndex].value;
break;
case "radio":
case "checkbox":
for (var i = 0; i < objElement.form.elements.length; i++) {
if (objElement.form.elements[i].name == objElement.name) {
if (objElement.form.elements[i].checked)
result += objElement.form.elements[i].value + ",";
}
}
break;
}
return result;
}
function InsertError(element, strMessage) {
if ((element.form.getAttribute("show_alert")) && (element.form.getAttribute("show_alert") != "0")) {
alert(strMessage);
return;
}
var strSpanID = element.name + "_val_error";
var objSpan = document.getElementById(strSpanID);
if (!objSpan) {
if ((element.type == "radio") || (element.type == "checkbox")) {
for (var i = 0; i < element.form.elements.length; i++) {
if (element.form.elements[i].name == element.name) {
element = element.form.elements[i];
}
}
}
objSpan = document.createElement("span");
objSpan.id = strSpanID;
objSpan.className = "validation_error";
var nodeAfter = 0;
var nodeParent = element.parentNode;
for (var i = 0; i < nodeParent.childNodes.length; i++) {
if (nodeParent.childNodes[i] == element) {
if (i < (nodeParent.childNodes.length - 1))
nodeAfter = nodeParent.childNodes[i + 1];
break;
}
}
if ((!nodeAfter) && (nodeParent.parentNode)) {
nodeParent = nodeParent.parentNode;
for (var i = 0; i < nodeParent.childNodes.length; i++) {
if (nodeParent.childNodes[i] == element.parentNode) {
if (i < (nodeParent.childNodes.length - 1))
nodeAfter = nodeParent.childNodes[i + 1];
break;
}
}
}
if (nodeAfter)
nodeParent.insertBefore(objSpan, nodeAfter);
else
document.body.appendChild(objSpan);
}
objSpan.innerHTML = strMessage;
}
function ClearError(element) {
var strSpanID = element.name + "_val_error";
var objSpan = document.getElementById(strSpanID);
if (objSpan) {
objSpan.innerHTML = "";
}
}
function allTrim(cValue) {
var lDone = false;
while (lDone == false) {
if (cValue.length == 0) { return cValue; }
if (cValue.indexOf(' ') == 0) { cValue = cValue.substring(1); lDone = false; continue; }
else { lDone = true; }
if (cValue.lastIndexOf(' ') == cValue.length - 1) { cValue = cValue.substring(0, cValue.length - 1); lDone = false; continue; }
else { lDone = true; }
}
return cValue;
}
function stripCharsInBag(s, bag) {
var i;
var returnString = "";
// Search through string’s characters one by one.
// If character is not in bag, append to returnString.
for (i = 0; i < s.length; i++) {
// Check that current character isn’t whitespace.
var c = s.charAt(i);
if (bag.indexOf(c) == -1) returnString += c;
}
return returnString;
}
HTML :
<form action="JsValidation.aspx" show_alert="1" onSubmit="return Validate(this);">
First Name <input type="Text" name="FirstName" maxlength="25" validate="not_empty" msg="First Name is Required" /><br/>
Email <input type="text" name="Email" maxlength="25" validate="email" msg="Email is Required" /><br/>
<input type="submit" value="Go">
</form>