For the life of my I cant get an Ajax request to work and submit my HTML form without refreshing, I've just never been able to pick up Ajax. I want my form to run the register.php without refreshing or redirecting to another page. Ideally I'd like to add a "You Registered" message in a div or something but for now I just want my form to submit without a refresh.
Here is my HTML:
<!DOCTYPE HTML>
<html>
<head>
<title>Social Media</title>
<script src="jquery-3.1.1.min.js"></script>
<script src="register.js"></script>
</head>
<body>
<span id='messasge'></span>
<form id='register_form' method='post' action='register.php'>
First: <input type='text' name='first_name' maxlength='30' required='required'><br>
Last: <input type='text' name='last_name' maxlength='30' required='required'><br>
Email: <input type='text' name='email' maxlength='60' required='required'><br>
Password: <input type='password' name='password' maxlength='60' required='required'><br>
<input type='submit' id='register_user' name='register' value='Register'>
</form>
<br>
<form id='login_form' action='login.php'>
Email: <input type='text' name='email' maxlength='60' required='required'><br>
Password: <input type='password' name='password' maxlength='60' required='required'><br>
<input type='submit' name='login' value='Log In'>
</form>
</body>
</html>
Here register.php that sends the form:
require_once 'connect.php';
// Salt for Hasing Password
$salt = '$kl._';
$pepper = 'l*&s';
// Sanative Input Completely
function sanitizeString($conn, $var) {
$var = stripslashes($var);
$var = strip_tags($var);
$var = htmlentities($var);
$var = $conn->real_escape_string($var);
return $var;
}
// Format Name w/ Only Capital First Letter
function formatName($var) {
$var = strtolower($var);
$var = ucwords($var);
return $var;
}
if(isset($_POST['register'])) {
$first_name = sanitizeString($conn, formatName($_POST['first_name']));
$last_name = sanitizeString($conn, formatName($_POST['last_name']));
$email = sanitizeString($conn, $_POST['email']);
$password = hash('ripemd128', $salt . $_POST['password'] . $pepper);
$stmt = $conn->prepare('INSERT INTO users (first_name, last_name, email, password)VALUES(?, ?, ?, ?)');
$stmt->bind_param('ssss', $first_name, $last_name, $email, $password);
$stmt->execute();
$stmt->close();
$conn->close();
}?>
JavaScript
$('#register_user').click(function() {
$.post( $("#register_form").attr("action"),
$("#register_form :input").serializeArray(), function(info) {
$("#message").html(info);
});
});
$("#register_user").submit(function() { return false; });