<?php
// Start session
session_start();
// Database connection settings
$servername = "localhost";
$username = "root"; // Default for XAMPP
$password = ""; // Leave empty for XAMPP
$dbname = "user_db"; // Ensure this matches your database name
// Create a connection to MySQL
$conn = new mysqli($servername, $username, $password, $dbname);
// Check if the connection is successful
if ($conn->connect_error) {
die("Connection failed: " . $conn->connect_error);
}
// Initialize message variables
$success_msg = "";
$error_msg = "";
// Process the form when submitted
if ($_SERVER["REQUEST_METHOD"] == "POST") {
$name = trim($_POST["name"]);
$roll_no = trim($_POST["roll_no"]);
$email = trim($_POST["email"]);
$password = trim($_POST["password"]);
// Validation checks
if (empty($name) || empty($roll_no) || empty($email) || empty($password)) {
$error_msg = "⚠ All fields are required!";
} elseif (!filter_var($email, FILTER_VALIDATE_EMAIL)) {
$error_msg = "❌ Invalid email format!";
} else {
// Check if email already exists
$check_email = $conn->prepare("SELECT id FROM users WHERE email = ?");
$check_email->bind_param("s", $email);
$check_email->execute();
$check_email->store_result();
if ($check_email->num_rows > 0) {
$error_msg = "❌ Email already registered! Try another.";
} else {
// Hash password for security
$hashed_password = password_hash($password, PASSWORD_DEFAULT);
// Insert user into database using prepared statement
$sql = "INSERT INTO users (name, roll_no, email, password) VALUES (?, ?, ?, ?)";
$stmt = $conn->prepare($sql);
$stmt->bind_param("ssss", $name, $roll_no, $email, $hashed_password);
if ($stmt->execute()) {
$success_msg = "🎉 You are registered successfully!";
} else {
$error_msg = "⚠ Error: " . $stmt->error;
}
$stmt->close();
}
$check_email->close();
}
}
// Close the database connection
$conn->close();
?>
<!DOCTYPE html>
<html lang="en">
<head>
<title>📝 User Registration</title>
<style>
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@700&display=swap');
body {
font-family: 'Poppins', sans-serif;
background: linear-gradient(45deg, #1e3c72, #2a5298, #6dd5ed, #2193b0);
background-size: 400% 400%;
animation: gradientBG 8s ease infinite;
text-align: center;
padding: 50px;
}
@keyframes gradientBG {
0% { background-position: 0% 50%; }
50% { background-position: 100% 50%; }
100% { background-position: 0% 50%; }
}
h2 {
font-size: 48px;
font-weight: bold;
background: linear-gradient(45deg, #1e3c72, #2a5298, #6dd5ed, #2193b0);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
.form-container {
display: flex;
justify-content: center;
align-items: center;
min-height: 70vh;
}
form {
background: white;
padding: 40px;
width: 500px;
text-align: left;
border-radius: 12px;
box-shadow: inset 0px 0px 15px rgba(0, 0, 0, 0.1), 0px 5px 15px rgba(0, 0, 0, 0.2);
}
label {
font-weight: bold;
font-size: 18px;
display: block;
margin-bottom: 5px;
}
input {
display: block;
width: calc(100% - 20px);
padding: 14px;
font-size: 16px;
border: 1px solid #ccc;
border-radius: 5px;
margin-bottom: 15px;
}
input:focus {
border-color: #007bff;
box-shadow: 0px 0px 5px rgba(0, 123, 255, 0.5);
}
button {
background-color: #007bff;
color: white;
padding: 16px;
font-size: 18px;
border: none;
border-radius: 8px;
cursor: pointer;
width: 100%;
transition: all 0.3s ease-in-out;
}
button:hover {
background-color: #0056b3;
transform: scale(1.05);
box-shadow: 0px 0px 15px rgba(0, 123, 255, 0.8);
}
/* Success & Error Message Styles */
.message-box {
display: none;
padding: 15px;
margin: 10px auto;
width: 450px;
font-size: 18px;
font-weight: bold;
text-align: center;
border-radius: 8px;
box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.2);
}
.success-box {
background-color: #d4edda;
color: #155724;
border: 1px solid #c3e6cb;
}
.error-box {
background-color: #f8d7da;
color: #721c24;
border: 1px solid #f5c6cb;
}
</style>
</head>
<body>
<h2>✨ Registration Form ✨</h2>
<!-- Display success message if registration was successful -->
<?php if (!empty($success_msg)) { ?>
<div class="message-box success-box" id="messageBox"><?= $success_msg ?></div>
<?php } ?>
<!-- Display error message if email already registered -->
<?php if (!empty($error_msg)) { ?>
<div class="message-box error-box" id="messageBox"><?= $error_msg ?></div>
<?php } ?>
<div class="form-container">
<form method="POST" action="">
<label>🧑 <b>Name:</b></label>
<input type="text" name="name" placeholder="Enter your name" required>
<label>🆔 <b>Roll No:</b></label>
<input type="text" name="roll_no" placeholder="Enter your roll number" required>
<label>📧 <b>Email:</b></label>
<input type="email" name="email" placeholder="Enter your email" required>
<label>🔒 <b>Password:</b></label>
<input type="password" name="password" placeholder="Enter your password" required>
<button type="submit">✅ Register</button>
</form>
</div>
<script>
// Show the message box and hide it after 5 seconds
document.addEventListener("DOMContentLoaded", function () {
var messageBox = document.getElementById("messageBox");
if (messageBox) {
messageBox.style.display = "block";
setTimeout(() => {
messageBox.style.display = "none";
}, 5000);
}
});
</script>
</body>
</html>
Telegram: DB developers channel