Well I'm working on client side validation, it's still got a ways to go but for some reason my catch error is displaying
<form action ="" method="POST">
<span id="tryErr"></span><br>
<input type="text" id="username" placeholder="Username"><br>
<span id="usernameErr"></span><br>
<input type="text" id="email" placeholder="Email address"><br>
<span id="emailErr"></span><br>
<input type="password" id="password" placeholder="Password"><br>
<span id="passwordErr"></span><br>
<input type="submit" value="Submit" onclick="validation();">
</form> function validation(e){
event.preventDefault(e);
var error = [],
username = document.getElementById('username').value,
email = document.getElementById('email').value,
password = document.getElementById('password').value,
filter = email.indexOf("@"),
dot = email.lastIndexOf(".");
try{
if(username == ""){
error = document.getElementById("usernameErr").innerHTML = "Please enter a username";
}
if(email == ""){
error = document.getElementById("emailErr").innerHTML = "Please enter a valid email";
}
if (filter<1 || dot<atpos+2 || dot+2>=x.length) {
error = document.getElementById("emailErr").innerHTML = "Please enter a valid email";
}
if(password == ""){
error = document.getElementById("passwordErr").innerHTML = "Please enter password";
}
else if(username < 3){
error = document.getElementById("usernameErr").innerHTML = "Username must be longer than three characters";
}
else{
console.log("I/'m a gazebo");
}
}
catch(error){
error = document.getElementById("tryErr").innerHTML = "Something went wrong try again later";
return false;
}
} 
