var value = "";
 var backgroundColor="#D8D8D8";

function validateFormOnSubmit(form) {
  value = "";

/////////////////////////////////////
//add entry to validate field
    var formid = form.id;
    validate(document.getElementById(formid+':username'), "", "USERNAME");
    validate(document.getElementById(formid+':pwd'), document.getElementById(formid+':confirmpwd'), "PASSWD");
    validate(document.getElementById(formid+':email'),"", "EMAIL");
 //////////////////////////////////////

if (value != "") {
    //alert("The Folloing form field(s) were incomplete or incorrect :<br/>" + value);
    document.getElementById("erroeMsgDiv").innerHTML = "<strong>The Folloing form field(s) were incomplete or incorrect :\n\
</strong><br/><div style='padding-left:10px;padding-top:5px;'>" + value +"</div>";
    return false;
  }

  return true;
}



///////////////////////////////////////////////////////////////////


function validate(inputElement, inputElement2, type){

var value = "";
if(type == "USERNAME"){
 value += validateUserName(inputElement);
}else if(type == "PASSWD"){
 value += validatePassword(inputElement, inputElement2);
}else if(type == "EMAIL"){
 value += validateEmail(inputElement);
}
return false;
}

//////////////////////////////////////////////////////////////////
//validate Name
function validateUserName(fld) {

    var illegalChars = /\W/; // allow only letters and numbers and underscore
    if (fld.value == "") {
        fld.style.background = backgroundColor; 
        value += "You didn't enter a username.<br/>";
    } else if (fld.value.length < 4) {
        fld.style.background = backgroundColor; 
        value += "The username must be greater than 3 character.<br/>";
    } else if (illegalChars.test(fld.value)) {
        fld.style.background = backgroundColor; 
        value += "The username contains only letters, numbers & underscore.<br/>";
    }else if(fld.value == "admin" || fld.value == "ADMIN"){
      value += "You can't create account with username admin.<br/>";
    }else {
        fld.style.background = 'White';
    }
    
}
//////////////////////////////////////////////////////////////////


////////////////////////////////////////////////////////////////
//validate password field
function validatePassword(fld, confirmfld) {
    var illegalChars = /[\W_]/; // allow only letters and numbers 
 
    if (fld.value == "") {
        fld.style.background = backgroundColor;
        value += "You didn't enter a password.<br/>";
    } else if (illegalChars.test(fld.value)) {
        value += "The password contains illegal characters.<br/>";
        fld.style.background = backgroundColor;
    }else if ((fld.value.length < 4) || (fld.value.length > 15)) {
        fld.style.background = backgroundColor; 
        value += "The Password must greater than 3 character & less than 15 character.<br/>";
    }else if (!((fld.value.search(/(a-z)+/)) && (fld.value.search(/(0-9)+/)))) {
        value += "The password must contain at least one numeral.<br/>";
        fld.style.background = backgroundColor;
    } else {
       if(fld.value != confirmfld.value){
       fld.style.background = backgroundColor;
       confirmfld.style.background = backgroundColor;
        value += "The password & confirm password must be same.<br/>";
        }else{
        fld.style.background = 'White';
        confirmfld.style.background = 'White';
        }
    }
  
}
//////////////////////////////////////////////////////////////////////////
//////////////////////////////////////////////////////////////////////////
//validate email Field
function validateEmail(fld) {

    var tfld = trim(fld.value);                        // value of field with whitespace trimmed off
    var emailFilter = /^[^@]+@[^@.]+\.[^@]*\w\w$/ ;
    var illegalChars= /[\(\)\<\>\,\;\:\\\"\[\]]/ ;
   
    if (fld.value == "") {
        fld.style.background = backgroundColor;
        value += "You didn't enter an email address.<br/>";
    } else if (!emailFilter.test(tfld)) {              //test email for illegal characters
        fld.style.background = backgroundColor;
        value += "Please enter a valid email address.<br/>";
    } else if (fld.value.match(illegalChars)) {
        fld.style.background = backgroundColor;
        value += "The email address contains illegal characters.<br/>";
    } else {
        fld.style.background = 'White';
    }
    
}
//////////////////////////////////////////////////////////////////////////

function trim(s)
{
  return s.replace(/^\s+|\s+$/, '');
}