<html><body><script language="javascript" type="text/javascript">function check(){ document.getElementById('errors').innerHTML =""; var errorStrings = ""; var userName = document.myForm.username.value; errorStrings += addComma(errorStrings) + zeroLength(userName); errorStrings += addComma(errorStrings) + tooShort(userName); errorStrings += addComma(errorStrings) + beginsWithoutCharacter(userName); errorStrings += addComma(errorStrings) + tooLong(userName); errorStrings += addComma(errorStrings) + containsSpaces(userName); errorStrings += addComma(errorStrings) + containsBadChars(userName); if( errorStrings != ""){ var errors = errorStrings.split(","); document.getElementById('errors').innerHTML = "Errors: "; var divElement, txtNode; for(var i=0; i < errors.length; i++){ divElement= document.createElement("div"); divElement.setAttribute("style","color:red;"); txtNode = document.createTextNode(errors[i]); divElement.appendChild(txtNode); document.getElementById("errors").appendChild(divElement); } } var remainingCharsTxtNode = document.createTextNode(getRemainingChars(userName) + " of 10"); document.getElementById("remaining").removeChild(document.getElementById("remaining").firstChild ); document.getElementById("remaining").appendChild(remainingCharsTxtNode); if (errorStrings.length <= 0 ){ document.getElementById('errors').innerHTML = "<span style='color:green'>Valid UserName</span>"; document.getElementById('checkavail').style.display = ""; return true; } else{ document.getElementById('checkavail').style.display = "none"; return false; }}function addComma(s){ if (s != "") return ","; else return "";}function tooShort(s){ if (s.length < 3 && s.length > 0) return "min length of 3"; else return "";}function getLength(s){ return s.length; }function beginsWithoutCharacter(s){ var myRE = /^[A-Za-z]/; if (!s.match(myRE)) return "must start with character"; else return "";}function containsSpaces(s){ if (s.indexOf(' ') == -1) return ""; else return "no spaces allowed";}function containsBadChars(s){ var myRE = /[^0-9A-Za-z ]+/; if (s.match(myRE)) return "illegal chars found"; else return "";}function zeroLength(s){ if (s.length <= 0) return "Field is blank"; else return "";}function tooLong(s){ var remainingChars = 10 - s.length; if (remainingChars < 0) return "can't be over 16 characters" else return "";}function getRemainingChars(s){ if (10 - s.length <= 0) return 0; else return 10 - s.length;}function toggleSubmit(toggle) { var obj = document.getElementById("submitbutton"); if (toggle == true) obj.style.display = ""; else if (toggle==false) obj.style.display = "none"; else obj.style.display = "none";}function available(){//put some other code here... toggleSubmit(true);}</script><form name="myForm">Name: <input onKeyUp="check()" type="text" name="username" /> <br />RemainingChars: <span id="remaining" style="font-weight:bold">10</span> <br/><div id="errors"></div><input id="submitbutton" type="submit" style="display:none;" value="sign up"/></form><div id="checkavail" style="display:none">Before You can Submit <a href="javascript:void(0)" onclick="available()">check if the username is available</a></div></body></html>