I am currently making a registration form using PHP, SQL and Javascript. I have a problem that is in the PHP script. If the code is without the PHP part, everything works perfectly, but if the PHP is a part of the code, it gives me a blank page when loaded. Please give me suggestions how to figure the problem out. Thank you in advance.
<!DOCTYPE html>
<html lang="en-US" class="Html" id="Main" dir="auto">
<head class="Head" id="Main">
<link rel="stylesheet" type="text/css" href="style.css">
<meta name="description" content="123">
<meta name="author" content="123">
<title class="Title" id="Title">Registration</title>
</head>
<body class="Body" id="Main">
<nav>
<ul>
<li><a href="home.php">Home</a></li>
<li><a href="about.php">About</a></li>
<li><a href="albums.php">The Albums</a></li>
<li><a href="shoppingcart.php">Shopping Cart</a></li>
</ul>
</nav>
<div class="a00">Registration</div>
<script type="text/javascript">
function FormValidation(theForm) {
var errors = "";
var email = /^\w+@[a-zA-Z_]+?\.[a-zA-Z]{2,3}$/;
var username = /^[a-zA-Z0-9]{3,15}$/;
var password = /^(?=.*[a-z])(?=.*[A-Z])(?=.*[0-9])(?=.*[!@#\$%\^&\*][a-zA-Z0-9!@#\$%\^&\*]{8,16}$/;
if (theForm.one.value == "") {
errors += "Please enter your username name! \n";
}
else if (!username.test(theForm.one.value)) {
errors += "Username is wrong! \n";
errors += "Username includes wrong characters! \n";
errors += "Username must include only alphabetical and numeric characters! \n";
errors += "Username must be between 3 and 15 characters! \n";
}
if (theForm.two.value == "") {
errors += "Please enter your password! \n";
}
else if (!password.test(theForm.two.value)) {
errors += "Password is wrong! \n";
errors += "Password includes wrong characters! \n";
errors += "Password must include at least one uppercase alphabetical character! \n";
errors += "Password must include at least one lowercase alphabetical character! \n";
errors += "Password must include at least one numerical character! \n";
errors += "Password must include at least one special character! \n";
errors += "Username must be between 8 and 16 characters! \n";
}
if (theForm.three.value == "") {
errors += "Please enter your e-mail address! \n";
}
else if (!email.test(theForm.three.value)) {
errors += "E-mail address is wrong \n";
errors += "E-mail address must be in the right format! \n";
}
if (!errors == "") {
alert("LIST OF ERRORS: \n" + errors);
return false;
} else {
return true;
}
}
function ShowHelpUsername() {
document.getElementById("demo1").innerHTML = "Help: Fill in your username. It must be unique and easy to remmeber.";
}
function ShowHelpPassword() {
document.getElementById("demo1").innerHTML = "Help: Fill in your password. It must include 1 uppercase alphabetical character, 1 lowercase alphabetical character, 1 numeric character, and 1 special character.";
}
function ShowHelpEmail() {
document.getElementById("demo1").innerHTML = "Help: Fill in your personal electronic mail.";
}
</script>
<?php
$con = mysqli_connect("", "","", "");
if (!$con) {
die("Error: " . mysqli_connect_error());
}
if (isset($_POST['register'])) {
$username=mysql_real_escape_string($_POST['one']);
$email=mysql_real_escape_string($_POST['three']);
$password=mysql_real_escape_string($_POST['two']);
$mysqlget="INSERT INTO users (username,email,password) VALUES ('$username','$email','$password')";
mysqli_query($con, $mysqlget) or die ("Error: " . mysql_error($con));
}
?>
<form method="POST" action="registration.php" class="myForm" name="myForm" onSubmit="javascript:return FormValidation(this)">
<div class="form-group-username">
<label for="username">Username</label><br>
<input type="text" placeholder="Between 3 and 15 characters" class="form-control-1" id="one" name="one" onfocus="ShowHelpUsername()">
</div>
<div class="form-group-password">
<label for="password">Password</label><br>
<input type="password" placeholder="Between 8 and 16 characters" class="form-control-2" id="two" name="two" onfocus="ShowHelpPassword()">
</div>
<div class="form-group-email">
<label for="e-mail">E-mail</label><br>
<input type="text" placeholder="For safety purposes" class="form-control-3" id="three" name="three" onfocus="ShowHelpEmail()">
</div>
<div class="form-group-submit">
<input type="submit" name="register" class="submit_form_55" value="Create Account">
</div>
<div class="form-group-help">
<p id="demo1"></p>
</div>
</form>
</body>
</html>