I'm sure I'm over looking something, I'm trying to do form validation (I'd started basic testing) however my errors aren't showing up,
$(document).ready(function () {
$("#register").on("submit",
function(event)
{
event.preventDefault();
$("span.error").empty()
$("span.success").empty()
$.post('registerForm.php', $(this).serialize(),
function(data)
{
if (data.fail)
{
$(".fail").append(data.fail)
}
else
if (!data.errors)
{
$("body, html").scrollTop(0)
$(".success").append(data.message)
window.setTimeout(function()
{
window.location.href = "index.php";
}, 5000);
}
else
{
$.each(data.errors,
function (i, datum)
{
$("[name='" + datum.name + "']").next().html(datum.error)
})
}
}
, 'json');
});
load class page
spl_autoload_register(function($class)
{
require 'classes/' . $class. '.class.php';
});
Validation class
<?php
class Validation
{
public
$password,
$repeatPassword,
$username,
$email;
public static
$minPassword = 5,
$confirmPassword = 5,
$minUsername = 3,
$validEmail;
public static function validateEmail($email)
{
if(filter_var($email, FILTER_VALIDATE_EMAIL) != self::$validEmail)
{
return true;
}
else
{
return false;
}
}
public static function validatePassword($password)
{
if(strlen($password) >= self::$minPassword)
{
return (strlen($password) >= self::$minPassword);
}
else
{
return false;
}
}
public static function validateRepeatPassword($repeatPassword)
{
if(strlen($repeatPassword) >= self::$confirmPassword)
{
return (strlen($repeatPassword) >= self::$confirmPassword);
}
else
{
return false;
}
}
public static function validateUsername($username)
{
if (strlen($username) >= self::$minUsername)
{
return (strlen($username) >= self::$minUsername);
}
else
{
return false;
}
}
}
Calling validation
<?php
require "loadclasses.php";
$password = $username = $email = $confirmPassword = "";
$password = trim(isset($_POST['password']));
$confirmPassword = trim(isset($_POST['repeatPassword']));
$username = trim(isset($_POST['username']));
$email = trim(isset($_POST['email']));
$errors = [];
if(!Validation::validatePassword($password))
{
$errors[] = ["name" => "password", "error" => "invalid password"];
}
if(!Validation::validateRepeatPassword($confirmPassword))
{
$errors[] = ["name" => "password", "error" => "Passwords must match"];
}
if(!Validation::validatePassword($password))
{
$errors[] = ["name" => "password", "error" => "Passwords must match"];
}
if(!Validation::validateUsername($username))
{
$errors[] = ["name" => "username", "error" => "invalid username"];
}
if(!Validation::validateEmail($email))
{
$errors[] = ["name" => "email", "error" => "invalid Email"];
}
else
{
$success = ["message" => "Please check your registered E-mail address to activate your account"];
}
header('Content-Type: application/json');
if (isset($success))
{
echo json_encode($success);
}
else
{
echo json_encode(["errors" => $errors]);
}
html page
<?php
session_start();
require "functions.php";
?>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no">
<link href="css/styles.css" rel="stylesheet">
<script src="js/jquery-3.1.1.min.js"></script>
<script src="js/scripts.js"></script>
<link rel="stylesheet" href="js/ui/jquery-ui.css">
<script src="js/ui/jquery-ui.min.js"></script>
<title>GOT social</title>
<?php include"includes/background.php"; ?>
</head>
<body>
<?php
include"includes/navbar.php";
?>
<div class="mainBody">
<div class="locations">
<div class="fix-background local">
<div class="heading"><h2>Register for Got Social</h2></div>
</div>
</div>
<form method="POST" class="contactUs-center" id="register">
<div class="form-group">
<label for="username">Username</label>
<input type="text" class="form-control" id="username" aria-describedby="username" placeholder="Username">
<span class="error"></span>
</div>
<div class="form-group">
<label for="email">Email address</label>
<input type="text" class="form-control" id="emailAddress" name="email" aria-describedby="emailHelp" placeholder="Enter email">
<span class="error"></span>
</div>
<div class="form-group">
<label for="password">Password</label>
<input type="password" class="form-control" id="password" name="password" aria-describedby="password" placeholder="Password">
<span class="error"></span>
</div>
<div class="form-group">
<label for="repeatpassword">Repeat password</label>
<input type="password" class="form-control" id="repeatpassword" name="repeatPassword" aria-describedby="repeatpassword" placeholder="Repeat password">
<span class="error"></span>
</div>
<div class="form-check">
<label class="form-check-label">
I agree
<input type="checkbox" class="form-check-input" name="terms">
</label>
</div>
<div class="form-check">
<a href="">Terms and conditions</a>
</label>
</div>
<div class="form-check">
<input type="submit" value="Send">
</div>
</form>
</div>
</body>
