Use jQuery to show errors while submitting registration form.

[harman30]

In the code below I want to show error messages using jQuery for registration form errors. Problem is this code is simply inserting data into database without checking any errors or showing error message and redirects to login page. So where I am going wrong or what I am missing? I have included jQuery library in original code.

if(isset($_POST['reg'])){
  $fn = ucfirst($_POST['fname']);
  $ln = ucfirst($_POST['lname']);
  $un = $_POST['username'];
  $em = $_POST['email'];
  $pswd = $_POST['password'];
  $pswd2 = $_POST['password2'];
 
  $sql=$db->prepare("SELECT username FROM userss WHERE username=:username");
  $sql->execute(array(':username'=>$un));
  $row = $sql->fetch(PDO::FETCH_ASSOC);
  $db_username = $row['username'];
  $usernames = $db_username;
 
  $data = array( "flname"=>"", "username" => "", "email" => "", "password" => "");
  if( isset($fn) && isset($ln) ) {
    if( $fn != "" && $ln!="" && $fn == $ln ) {
      $data["flname"] = "cntbempty";
    }
  }
  if( isset($un) ) {
    if( in_array( $un, $usernames ) ) {
      $data["username"] = "inuse";
    }
  }
  if( isset($pswd) && isset($pswd2) ) {
    if( $pswd2 != "" && $pswd != $pswd2 ) {
      $data["password"] = "missmatch";
    }
  }
  if( isset( $em ) ) {
    if( $em != "" && !preg_match( "/^([a-zA-Z0-9])+([a-zA-Z0-9\._-])*@([a-zA-Z0-9_-])+([a-zA-Z0-9\._-]+)+$/", $_POST["email"] ) ) {
      $data["email"] = "notvalid";
    }
  }
  echo json_encode( $data );
 
  $pswd = password_hash($pswd, PASSWORD_DEFAULT);
  $pswd2 = password_hash($pswd2, PASSWORD_DEFAULT);
  $stmt = $db->prepare("INSERT INTO userss (username,first_name,last_name,email,password,password2,) VALUES (:username,:first_name,:last_name,:email,:password,:password2,)");  
  $stmt->execute( array(':username'=>$un,':first_name'=>$fn,':last_name'=>$ln,':email'=>$em,':password'=>$pswd,':password2'=>$pswd2));
 
  if ($stmt->rowCount() == 1) {
    header("Location: login.php");
  } 
  else {
    echo "error";
  }
}
?>

jQuery code is:

$(document).ready(function(){
  $("form.register").change(function() {
    $.post("register.php", $("form.register").serialize(), function( data ) {
      if( data.flname == "cntbempty" )
        $("p#name_error").slideDown();
      else
        $("p#name_error").hide();
      if( data.username == "inuse" )
        $("p#username_error").slideDown();
      else
        $("p#username_error").hide();
      if( data.password == "missmatch" )
        $("p#password_error").slideDown();
      else
        $("p#password_error").hide();
      if( data.email == "notvalid" )
        $("p#email_error").slideDown();
      else
        $("p#email_error").hide();
    }, "json");
  });
});