UserName

How to validate username

by Samar Pattanayak

HTML

<div>

  Enter Username:
  <input type="text" id="txtuser" class="change" onkeyup="test()" onkeydown="test()" autofocus><span class="error" id="span1"></span>


</div>
<div style="margin-top: 5px">
Enter Password :
<input type="text" id="txtpassword" class="change">

</div>

CSS

.error {
  color: red;
  font-weight: bold;
}
.change{
  border-radius: 5px;
  border: 1px solid grey;
  padding-left: 5px;
  margin-left: 5px;
}

JavaScript

function test() {
  var input = document.getElementById("txtuser").value;
  if (input.length > 6) {
    if (/[0-9]/.test(input) && /[!@#$%^&*]/.test(input)) {
      document.getElementById("span1").innerHTML = "Oh Great ! You got your username";
      console.log("1");
    } else if (/[0-9]/.test(input) && !(/[!@#$%^&*]/.test(input))) {
      document.getElementById("span1").innerHTML = "Please include a special character";
      console.log("2");
    } else if (!(/[0-9]/.test(input)) && (/[!@#$%^&*]/.test(input))) {
      document.getElementById("span1").innerHTML = "Please include a number";
      console.log("3")
    } else {
      document.getElementById("span1").innerHTML = "Please include a number & a special character";
    }
  } else {
    document.getElementById("span1").innerHTML = "";
  }

};