@ -6,6 +6,36 @@
< title > Create Account - Temphire< / title >
< title > Create Account - Temphire< / title >
< link href = "https://cdnjs.cloudflare.com/ajax/libs/tailwindcss/2.2.19/tailwind.min.css" rel = "stylesheet" >
< link href = "https://cdnjs.cloudflare.com/ajax/libs/tailwindcss/2.2.19/tailwind.min.css" rel = "stylesheet" >
< link href = "https://cdnjs.cloudflare.com/ajax/libs/daisyui/2.6.0/full.css" rel = "stylesheet" >
< link href = "https://cdnjs.cloudflare.com/ajax/libs/daisyui/2.6.0/full.css" rel = "stylesheet" >
< script >
function validateForm() {
const password = document.getElementById('password').value;
const contact = document.getElementById('contact').value;
const passwordError = document.getElementById('password-error');
const contactError = document.getElementById('contact-error');
let isValid = true;
// Password validation
const passwordCriteria = /^(?=.*[a-z])(?=.*[A-Z])(?=.*\d)(?=.*[@$!%*?&])[A-Za-z\d@$!%*?&]{8,}$/;
if (!passwordCriteria.test(password)) {
passwordError.textContent = "Password must be at least 8 characters long, include at least one uppercase letter, one lowercase letter, one number, and one special character.";
isValid = false;
} else {
passwordError.textContent = "";
}
// Contact validation
const contactCriteria = /^\d{10}$/;
if (!contactCriteria.test(contact)) {
contactError.textContent = "Contact number must be exactly 10 digits.";
isValid = false;
} else {
contactError.textContent = "";
}
return isValid;
}
< / script >
< / head >
< / head >
< body class = "min-h-screen bg-base-200" >
< body class = "min-h-screen bg-base-200" >
<?php include 'navbar.php' ; ?>
<?php include 'navbar.php' ; ?>
@ -16,7 +46,7 @@
< div class = "card-body" >
< div class = "card-body" >
< h2 class = "card-title text-2xl font-bold text-center mb-6" > Create Account< / h2 >
< h2 class = "card-title text-2xl font-bold text-center mb-6" > Create Account< / h2 >
< form method = "post" action = "register.php" class = "space-y-4" >
< form method = "post" action = "register.php" class = "space-y-4" onsubmit = "return validateForm();" >
<!-- Name Fields -->
<!-- Name Fields -->
< div class = "grid grid-cols-1 md:grid-cols-2 gap-4" >
< div class = "grid grid-cols-1 md:grid-cols-2 gap-4" >
< div class = "form-control" >
< div class = "form-control" >
@ -49,7 +79,8 @@
< label class = "label" >
< label class = "label" >
< span class = "label-text" > Contact< / span >
< span class = "label-text" > Contact< / span >
< / label >
< / label >
< input type = "number" name = "contact" id = "contact" class = "input input-bordered w-full" / >
< input type = "text" name = "contact" id = "contact" class = "input input-bordered w-full" inputmode = "numeric" pattern = "\d*" required / >
< small id = "contact-error" class = "text-error" > < / small >
< / div >
< / div >
<!-- Email -->
<!-- Email -->
@ -74,12 +105,11 @@
< span class = "label-text" > Password< / span >
< span class = "label-text" > Password< / span >
< / label >
< / label >
< input type = "password" name = "password" id = "password" class = "input input-bordered w-full" required / >
< input type = "password" name = "password" id = "password" class = "input input-bordered w-full" required / >
< small id = "password-error" class = "text-error" > < / small >
< / div >
< / div >
<!-- Submit Button -->
<!-- Submit Button -->
<!-- <div class="form - control mt - 9"> -->
< button type = "submit" name = "signup" class = "btn btn-primary btn-sm w-full" > Sign up< / button >
< button type = "submit" name = "signup" class = "btn btn-primary btn-sm w-full" > Sign up< / button >
<!-- </div> -->
< / form >
< / form >
< / div >
< / div >
< / div >
< / div >
@ -88,4 +118,4 @@
<?php include 'footer.php' ; ?>
<?php include 'footer.php' ; ?>
< / body >
< / body >
< / html >
< / html >