In membership-based website registration and login page is common.
User needs to create a new account and login to the website to access services and manage its account.
In this tutorial, I show how you can create a signup page with MySQL and PHP.
Contents
1. Table structure
I am using users table in the example.
CREATE TABLE `users` ( `id` int(11) NOT NULL PRIMARY KEY AUTO_INCREMENT, `fname` varchar(80) NOT NULL, `lname` varchar(80) NOT NULL, `email` varchar(80) NOT NULL, `password` varchar(80) NOT NULL ) ENGINE=InnoDB DEFAULT CHARSET=latin1;
2. Configuration
Create a new config.php file for database configuration.
Completed Code
<?php
session_start();
$host = "localhost"; /* Host name */
$user = "root"; /* User */
$password = ""; /* Password */
$dbname = "tutorial"; /* Database name */
$con = mysqli_connect($host, $user, $password,$dbname);
// Check connection
if (!$con) {
die("Connection failed: " . mysqli_connect_error());
}
3. HTML & PHP
Create a <form method='post' action='' >.
If $error_message is not empty then display $error_message value on the screen. Similarly, if $success_message is not empty then display the $success_message value on the screen.
NOTE – Value is assigned to
$error_messageand$success_messagevariable on<form >submit according to conditions.
Add input fields for entering – first name, last name, email, password, and confirm password.
Also, add a submit button.
Completed Code
<?php
include "config.php";
?>
<!DOCTYPE html>
<html>
<head>
<title>Create Registration form with MySQL and PHP</title>
<!-- Bootstrap CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/css/bootstrap.min.css">
<!-- jQuery library -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<!-- Bootstrap JS -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/js/bootstrap.min.js"></script>
</head>
<body>
<div class='container'>
<div class='row'>
<div class='col-md-6' >
<form method='post' action=''>
<h1>SignUp</h1>
<?php
// Display Error message
if(!empty($error_message)){
?>
<div class="alert alert-danger">
<strong>Error!</strong> <?= $error_message ?>
</div>
<?php
}
?>
<?php
// Display Success message
if(!empty($success_message)){
?>
<div class="alert alert-success">
<strong>Success!</strong> <?= $success_message ?>
</div>
<?php
}
?>
<div class="form-group">
<label for="fname">First Name:</label>
<input type="text" class="form-control" name="fname" id="fname" required="required" maxlength="80">
</div>
<div class="form-group">
<label for="lname">Last Name:</label>
<input type="text" class="form-control" name="lname" id="lname" required="required" maxlength="80">
</div>
<div class="form-group">
<label for="email">Email address:</label>
<input type="email" class="form-control" name="email" id="email" required="required" maxlength="80">
</div>
<div class="form-group">
<label for="password">Password:</label>
<input type="password" class="form-control" name="password" id="password" required="required" maxlength="80">
</div>
<div class="form-group">
<label for="pwd">Confirm Password:</label>
<input type="password" class="form-control" name="confirmpassword" id="confirmpassword" onkeyup='' required="required" maxlength="80">
</div>
<button type="submit" name="btnsignup" class="btn btn-default">Submit</button>
</form>
</div>
</div>
</div>
</body>
</html>
4. Form Submit
Add the following code in <head> section.
On <form > submit assign $_POST values in variables.
Validate the values –
To check the input values are valid or not created a $isValid = true variable. If any validation is false then assign false to $isValid and record not inserted.
- First, check if all values are entered or not. If not entered then assign
falseto$isValidand"Please fill all fields."to$error_message. - Check if entered password and confirm password are equal or not. If not equal then assign
falseto$isValidand"Confirm password not matching."to$error_message. - Check if
$emailvariable value has a valid email or not. If not valid then assignfalseto$isValidand"Invalid Email-ID."to$error_message. - Check if email-id already exists in
userstable or not. If available then assignfalseto$isValidand"Email-ID is already existed."to$error_message.
If $isValid has true value then insert a new record in the users table and assign "Account created successfully." to $success_message.
Completed Code
<?php
$error_message = "";$success_message = "";
// Register user
if(isset($_POST['btnsignup'])){
$fname = trim($_POST['fname']);
$lname = trim($_POST['lname']);
$email = trim($_POST['email']);
$password = trim($_POST['password']);
$confirmpassword = trim($_POST['confirmpassword']);
$isValid = true;
// Check fields are empty or not
if($fname == '' || $lname == '' || $email == '' || $password == '' || $confirmpassword == ''){
$isValid = false;
$error_message = "Please fill all fields.";
}
// Check if confirm password matching or not
if($isValid && ($password != $confirmpassword) ){
$isValid = false;
$error_message = "Confirm password not matching";
}
// Check if Email-ID is valid or not
if ($isValid && !filter_var($email, FILTER_VALIDATE_EMAIL)) {
$isValid = false;
$error_message = "Invalid Email-ID.";
}
if($isValid){
// Check if Email-ID already exists
$stmt = $con->prepare("SELECT * FROM users WHERE email = ?");
$stmt->bind_param("s", $email);
$stmt->execute();
$result = $stmt->get_result();
$stmt->close();
if($result->num_rows > 0){
$isValid = false;
$error_message = "Email-ID is already existed.";
}
}
// Insert records
if($isValid){
$insertSQL = "INSERT INTO users(fname,lname,email,password ) values(?,?,?,?)";
$stmt = $con->prepare($insertSQL);
$stmt->bind_param("ssss",$fname,$lname,$email,$password);
$stmt->execute();
$stmt->close();
$success_message = "Account created successfully.";
}
}
?>
5. Demo
6. Conclusion
In this tutorial, I only cover the registration system and if you want to know how to create a login page then you can view the following tutorial.
If you found this tutorial helpful then don't forget to share.