Friday, 29 November 2019

PHP MySql Based Online Exam System Project



This tutorial will help you to make Online Examination System using PHP script with Mysql Database. So, Are looking for any educational project or build small system in PHP using Mysql database, then you have come on the right place. Because in this post, you can find the solution of your needs. Here we will build Online Examination application in PHP with Mysql database, which will help you to build your education final year project. And if you are beginner level of PHP programmer and are you learn how to any Online dynamic system in PHP then this post will help you.

What is Online Exam System?


In the world of internet, all task has been done through internet, so we have decide why Exam has not conducted through internet. For convert current exam system into digital exam system, we have build this small Online Exam system project. If this system has build in professional level then it will automate our existing examination system into digitize exam system. In this system it will required less labor force for execute system and it will be more accurate and less time consuming and at the same time we can conduct more person exam at the same time and it will publish result in a very short time. Below you can find benefits of Online Examination System. If this system has been implemented then examination will not limited in to four wall of class room, but student can part into exam from any place.

Benefits of Online Examination System


  1. Online Exam System will Save Organisation and Student Money.
  2. Online Exam System will Securely Store Exam Question Papar and it will directly visible to Student who has take part in Exam.
  3. Online Exam System will Save the Cost of Paper, because Exam will be conduct online.
  4. Online Exam System will reduce the cost of logestic for deliver question paper on examination center.
  5. Online Exam System will save the time of both Institution who has conduct examination and student who has take part in Exam.
  6. Online Exam System will provide Remote Supervision by using security feature of this system.
  7. Online Exam System will reduce the time of publish exam result with Ranking, because in single click result will be generated.
  8. Online Exam System will give us history of old examination in a single click.
  9. Online Exam System has provide all student information in single plateform.
  10. Online Exam System has provide facility to use to take part by using any electronic device in which internet access facility available.



Features of Online Exam System


Admin Side


  1. Admin Can Create New Online Exam with Edit and Delete Feature
  2. Admin Can Add Question in Exam which has been define at the time of create exam
  3. Admin Can View All Exam Question with Edit and Delete Operation
  4. Admin Can view all user data who has register for online examination system
  5. Admin can view all user who has enroll for particular exam
  6. Admin can view individual user exam result on web page and in PDF format
  7. Admin can view combine result of exam with user rank on web page and in PDF format

User Side


  1. New User Registration for Online Examination with Confirmation Email Feature
  2. User can Login into System using Email ID and Password
  3. User can manage his or her profile details
  4. User can change his or her password
  5. User can view available examination list
  6. User can enroll into examination
  7. User can attend online examination at the define date and time
  8. User can view the history of exam which he or she had enroll
  9. User can view the exam result on Web page and in PDF format also.

Technology used in Online Exam System



Front end


  1. HTML 5 - For make HTML Web page
  2. jQuery - For easier to use Javascript on web page
  3. Ajax - For Perform Server operation at client side
  4. Bootstrap 4 - For make Responsive Online Exam System
  5. jQuery Datatable Plugin - For list data on web page in table format with different feature like searching sorting etc.
  6. Parsley.js - For Validate form data at client side
  7. Bootstrap Datetimepicker - User for Data and time field form data
  8. TimeCircles - For Display remaining exam time on web page

Back end


  1. PHP 5.6+ - For write system login
  2. Mysql - For store system data
  3. PHPMailer - For Send email after registration
  4. DomPdf - For generate exam result in PDf format

Database Structure of Online Exam System



Source code Online Exam System


master/register.php


In this file we will make registration form for set up Admin account for Online Examination system. Suppose we have to require multiple Admin account for different purpose, so here we have make registration form for create new Admin account for Web based exam application. By this feature this system will be fully dynamic system.

For validate unique email address for admin registration, here we have use Parsley.js custom validator. This validator will check particular email already register in our system or not. This validator will trigger before form submission, when this validator has been trigger then it will send Ajax request to sever script for check admin has already register with particular email in our database.

Here we have use Ajax for submit Admin Registration form data to server, when we have click on register button, then by using jQuery code, it will add parsley attribute for verify form data. If form data is proper, then it will send form data to server using Ajax request.

master/register.php

<?php

//register.php

include('Examination.php');

$exam = new Examination;

$exam->admin_session_public();

?>

<!DOCTYPE html>
<html lang="en">
<head>
   <title>Online Examination System in PHP</title>
   <meta charset="utf-8">
   <meta name="viewport" content="width=device-width, initial-scale=1">
   <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css">
   <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.0/jquery.min.js"></script>
   <script src="https://cdn.jsdelivr.net/gh/guillaumepotier/Parsley.js@2.9.1/dist/parsley.js"></script>
   <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js"></script>
   <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"></script>
   <link rel="stylesheet" href="../style/style.css" />
</head>
<body>
 <div class="jumbotron text-center" style="margin-bottom:0; padding: 1rem 1rem;">
     <img src="logo.png" class="img-fluid" width="300" alt="Online Examination System in PHP" />
 </div>

 <div class="container">
    <div class="row">
      <div class="col-md-3">

      </div>
      <div class="col-md-6" style="margin-top:20px;">
       <span id="message"></span>
         <div class="card">
           <div class="card-header">Admin Registration</div>
           <div class="card-body">
              <form method="post" id="admin_register_form">
                    <div class="form-group">
                        <label>Enter Email Address</label>
                        <input type="text" name="admin_email_address" id="admin_email_address" class="form-control" data-parsley-checkemail data-parsley-checkemail-message='Email Address already Exists' />
                    </div>
                    <div class="form-group">
                      <label>Enter Password</label>
                      <input type="password" name="admin_password" id="admin_password" class="form-control" />
                    </div>
                    <div class="form-group">
                      <label>Enter Confirm Password</label>
                      <input type="password" name="confirm_admin_password" id="confirm_admin_password" class="form-control" />
                    </div>
                    <div class="form-group">
                      <input type="hidden" name="page" value="register" />
                      <input type="hidden" name="action" value="register" />
                      <input type="submit" name="admin_register" id="admin_register" class="btn btn-info" value="Register" />
                    </div>
                  </form>
              <div align="center">
               <a href="login.php">Login</a>
              </div>
           </div>
         </div>
      </div>
      <div class="col-md-3">

      </div>
    </div>
 </div>

</body>
</html>

<script>

$(document).ready(function(){

 window.ParsleyValidator.addValidator('checkemail', {
    validateString: function(value)
    {
      return $.ajax({
        url:"ajax_action.php",
        method:"POST",
        data:{page:'register', action:'check_email', email:value},
        dataType:"json",
        async: false,
        success:function(data)
        {
          return true;
        }
      });
    }
  });

  $('#admin_register_form').parsley();

  $('#admin_register_form').on('submit', function(event){

    event.preventDefault();

    $('#admin_email_address').attr('required', 'required');

    $('#admin_email_address').attr('data-parsley-type', 'email');

    $('#admin_password').attr('required', 'required');

    $('#confirm_admin_password').attr('required', 'required');

    $('#confirm_admin_password').attr('data-parsley-equalto', '#admin_password');

    if($('#admin_register_form').parsley().isValid())
    {
      $.ajax({
        url:"ajax_action.php",
        method:"POST",
        data:$(this).serialize(),
        dataType:"json",
        beforeSend:function(){
          $('#admin_register').attr('disabled', 'disabled');
          $('#admin_register').val('please wait...');
        },
        success:function(data)
        {
          if(data.success)
          {
            $('#message').html('<div class="alert alert-success">Please check your email</div>');
            $('#admin_register_form')[0].reset();
            $('#admin_register_form').parsley().reset();
          }

          $('#admin_register').attr('disabled', false);
          $('#admin_register').val('Register');
        }
      });
    }

  });

});

</script>


master/Examination.php


This is main PHP class for this Online Exam Application. Here we will PHP PDO Object Oriented Programming for build logic of this Online Quiz system. In this class we have make following method, which we will used for different purpose to build Online Examination System in PHP.

  1. __construct() - This is the magic function code will be execute on every time whenever this class new object has been created, and on every new object creation it will make database connection with this Online Exam system using PHP PDO class object.
  2. execute_query() - This method will used for execute SQL query for database operation.
  3. total_row() - This method will return total number of rows has been affected after query execution. In this method we have used execute_query() method also.
  4. send_email($receiver_email, $subject, $body) - In this method, we have create object of PHPMailer class, and this method we will use for send email in this Online examination system.
  5. redirect($page) - This method we will used for redirect page.
  6. admin_session_private() - This method will check if admin has login into system, if admin not login into system and try to access web page, which has required login into system. Then it will redirect to admin login page.
  7. admin_session_public() - This another method, which has been check admin login. This method will check admin has login into system and try to access login or register page, then it will redirect to index.php page.
  8. query_result() - This method will use execute_query() method for execute SQL query and return query execution result in associative array format.

master/Examination.php

<?php

class Examination
{
 var $host;
 var $username;
 var $password;
 var $database;
 var $connect;
 var $home_page;
 var $query;
 var $data;
 var $statement;
 var $filedata;

 function __construct()
 {
  $this->host = 'localhost';
  $this->username = 'root';
  $this->password = '';
  $this->database = 'online_examination';
  $this->home_page = 'http://localhost/tutorial/online_examination/';

  $this->connect = new PDO("mysql:host=$this->host; dbname=$this->database", "$this->username", "$this->password");

  session_start();
 }

 function execute_query()
 {
  $this->statement = $this->connect->prepare($this->query);
  $this->statement->execute($this->data);
 }

 function total_row()
 {
  $this->execute_query();
  return $this->statement->rowCount();
 }

 function send_email($receiver_email, $subject, $body)
 {
  $mail = new PHPMailer;

  $mail->IsSMTP();

  $mail->Host = 'smtp host';

  $mail->Port = '587';

  $mail->SMTPAuth = true;

  $mail->Username = '';

  $mail->Password = '';

  $mail->SMTPSecure = '';

  $mail->From = 'info@webslesson.info';

  $mail->FromName = 'info@webslesson.info';

  $mail->AddAddress($receiver_email, '');

  $mail->IsHTML(true);

  $mail->Subject = $subject;

  $mail->Body = $body;

  $mail->Send();  
 }

 function redirect($page)
 {
  header('location:'.$page.'');
  exit;
 }
 
 function admin_session_private()
 {
  if(!isset($_SESSION['admin_id']))
  {
   $this->redirect('login.php');
  }
 }

 function admin_session_public()
 {
  if(isset($_SESSION['admin_id']))
  {
   $this->redirect('index.php');
  }
 }

 function query_result()
 {
  $this->execute_query();
  return $this->statement->fetchAll();
 }
}

?>


master/ajax_action.php


In this PHP file, you can find PHP script of all operation, which it had done at master side, you can find here. This file will received Ajax request for do different operation.

In this file, we have include Examination.php class and PHPMailer class library. Here you can find different database related operation will be perform here.

  • In this file, first it has received Ajax request from Admin Register page for check particular Admin Email already register or not in Mysql database.
  • After Check unique Admin email address, this page also received second Ajax request from Admin register page for complete Admin registration process, once registeration data has been inserted then it will make dynamic admin email verification email and send to admin email address for email verification process.
  • Once Registration has been completed and admin has try to login into system, then admin login details has been validated here by using Ajax request.
master/ajax_action.php

<?php

//ajax_action.php

include('Examination.php');

require_once('../class/class.phpmailer.php');

$exam = new Examination;

$current_datetime = date("Y-m-d") . ' ' . date("H:i:s", STRTOTIME(date('h:i:sa')));

if(isset($_POST['page']))
{
 if($_POST['page'] == 'register')
 {
  if($_POST['action'] == 'check_email')
  {
   $exam->query = "
   SELECT * FROM admin_table 
   WHERE admin_email_address = '".trim($_POST["email"])."'
   ";

   $total_row = $exam->total_row();

   if($total_row == 0)
   {
    $output = array(
     'success' => true
    );

    echo json_encode($output);
   }
  }

  if($_POST['action'] == 'register')
  {
   $admin_verification_code = md5(rand());

   $receiver_email = $_POST['admin_email_address'];

   $exam->data = array(
    ':admin_email_address'  => $receiver_email,
    ':admin_password'   => password_hash($_POST['admin_password'], PASSWORD_DEFAULT),
    ':admin_verfication_code' => $admin_verification_code,
    ':admin_type'    => 'sub_master', 
    ':admin_created_on'   => $current_datetime
   );

   $exam->query = "
   INSERT INTO admin_table 
   (admin_email_address, admin_password, admin_verfication_code, admin_type, admin_created_on) 
   VALUES 
   (:admin_email_address, :admin_password, :admin_verfication_code, :admin_type, :admin_created_on)
   ";

   $exam->execute_query();

   $subject = 'Online Examination Registration Verification';

   $body = '
   <p>Thank you for registering.</p>
   <p>This is a verification eMail, please click the link to verify your eMail address by clicking this <a href="'.$exam->home_page.'verify_email.php?type=master&code='.$admin_verification_code.'" target="_blank"><b>link</b></a>.</p>
   <p>In case if you have any difficulty please eMail us.</p>
   <p>Thank you,</p>
   <p>Online Examination System</p>
   ';

   $exam->send_email($receiver_email, $subject, $body);

   $output = array(
    'success' => true
   );

   echo json_encode($output);
  }
 }

 if($_POST['page'] == 'login')
 {
  if($_POST['action'] == 'login')
  {
   $exam->data = array(
    ':admin_email_address' => $_POST['admin_email_address']
   );

   $exam->query = "
   SELECT * FROM admin_table 
   WHERE admin_email_address = :admin_email_address
   ";

   $total_row = $exam->total_row();

   if($total_row > 0)
   {
    $result = $exam->query_result();

    foreach($result as $row)
    {
     if($row['email_verified'] == 'yes')
     {
      if(password_verify($_POST['admin_password'], $row['admin_password']))
      {
       $_SESSION['admin_id'] = $row['admin_id'];
       $output = array(
        'success' => true
       );
      }
      else
      {
       $output = array(
        'error' => 'Wrong Password'
       );
      }
     }
     else
     {
      $output = array(
       'error'  => 'Your Email is not verify'
      );
     }
    }
   }
   else
   {
    $output = array(
     'error'  => 'Wrong Email Address'
    );
   }
   echo json_encode($output);
  }

 }
}

?>


master/login.php


Once Admin has verified his or her email address, then after page will redirect to this Online Examination System login page with success message on web page.

This Online Examination Admin Login page, and for get access into system in the Admin area of Online Examination system. So by using this page Admin can get access into this system. Admin login details will be validate here by using Ajax request.

<?php

//login.php

include('Examination.php');

$exam = new Examination;

$exam->admin_session_public();

?>

<!DOCTYPE html>
<html lang="en">
<head>
   <title>Online Examination System in PHP</title>
   <meta charset="utf-8">
   <meta name="viewport" content="width=device-width, initial-scale=1">
   <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css">
   <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.0/jquery.min.js"></script>
   <script src="https://cdn.jsdelivr.net/gh/guillaumepotier/Parsley.js@2.9.1/dist/parsley.js"></script>
   <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js"></script>
   <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"></script>
   <link rel="stylesheet" href="../style/style.css" />
</head>
<body>
 <div class="jumbotron text-center" style="margin-bottom:0; padding: 1rem 1rem;">
     <img src="logo.png" class="img-fluid" width="300" alt="Online Examination System in PHP" />
 </div>

 <div class="container">
    <div class="row">
      <div class="col-md-3">

      </div>
      <div class="col-md-6" style="margin-top:20px;">
       
       <span id="message">
       <?php
       if(isset($_GET['verified']))
       {
        echo '
        <div class="alert alert-success">
         Your email has been verified, now you can login
        </div>
        ';
       }
       ?>
       </span>
          <div class="card">
            <div class="card-header">Admin Login</div>
            <div class="card-body">
              <form method="post" id="admin_login_form">
                <div class="form-group">
                  <label>Enter Email Address</label>
                  <input type="text" name="admin_email_address" id="admin_email_address" class="form-control" />
                </div>
                <div class="form-group">
                  <label>Enter Password</label>
                  <input type="password" name="admin_password" id="admin_password" class="form-control" />
                </div>
                <div class="form-group">
                  <input type="hidden" name="page" value="login" />
                  <input type="hidden" name="action" value="login" />
                  <input type="submit" name="admin_login" id="admin_login" class="btn btn-info" value="Login" />
                </div>
              </form>
              <div align="center">
                <a href="register.php">Register</a>
              </div>
            </div>
          </div>
         
      </div>
      <div class="col-md-3">

      </div>
    </div>
 </div>

</body>
</html>

<script>

$(document).ready(function(){

 $('#admin_login_form').parsley();

  $('#admin_login_form').on('submit', function(event){
    event.preventDefault();

    $('#admin_email_address').attr('required', 'required');

    $('#admin_email_address').attr('data-parsley-type', 'email');

    $('#admin_password').attr('required', 'required');

    if($('#admin_login_form').parsley().validate())
    {
      $.ajax({
        url:"ajax_action.php",
        method:"POST",
        data:$(this).serialize(),
        dataType:"json",
        beforeSend:function(){
          $('#admin_login').attr('disabled', 'disabled');
          $('#admin_login').val('please wait...');
        },
        success:function(data)
        {
          if(data.success)
          {
            location.href="index.php";
          }
          else
          {
            $('#message').html('<div class="alert alert-danger">'+data.error+'</div>');
          }
          $('#admin_login').attr('disabled', false);
          $('#admin_login').val('Login');
        }
      });
    }

  });

});

</script>


master/header.php


This is the header file of Online Examination System Admin area, and in this file first we have include Examination class file and then after for check Admin has login into system or not. We have called admin_session_private() method.

In this file we have make navbar by using Bootstrap 4 library. In navbar we have add link for go to Exam section, user section and logout page link.

master/header.php

<?php

//header.php

include('Examination.php');

$exam = new Examination;

$exam->admin_session_private();

?>

<!DOCTYPE html>
<html lang="en">
<head>
   <title>Online Examination System in PHP</title>
   <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css">
    <link rel="stylesheet" href="https://cdn.datatables.net/1.10.19/css/dataTables.bootstrap4.min.css">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.0/jquery.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"></script>
    <script src="https://cdn.datatables.net/1.10.19/js/jquery.dataTables.min.js"></script>
    <script src="https://cdn.datatables.net/1.10.19/js/dataTables.bootstrap4.min.js"></script>
    <script src="https://cdn.jsdelivr.net/gh/guillaumepotier/Parsley.js@2.9.1/dist/parsley.js"></script>
   <link rel="stylesheet" href="../style/style.css" />
    <link rel="stylesheet" href="../style/bootstrap-datetimepicker.css" />
    <script src="../style/bootstrap-datetimepicker.js"></script>
</head>
<body>
 <div class="jumbotron text-center" style="margin-bottom:0; padding: 1rem 1rem;">
    <img src="logo.png" class="img-fluid" width="300" alt="Online Examination System in PHP" />
 </div>

    <nav class="navbar navbar-expand-sm bg-dark navbar-dark">
        <a class="navbar-brand" href="index.php">Admin Side</a>
        <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#collapsibleNavbar">
            <span class="navbar-toggler-icon"></span>
        </button>
        <div class="collapse navbar-collapse" id="collapsibleNavbar">
            <ul class="navbar-nav">
                <li class="nav-item">
                    <a class="nav-link" href="logout.php">Logout</a>
                </li>   
            </ul>
        </div>  
    </nav>

 <div class="container-fluid">


master/index.php



<?php

//index.php

include('header.php');

include('footer.php');

?>
    
 


master/logout.php


This is logout script for logout from Admin side of Online examination system. This script will destroy all active session variable by using session_destroy() function and after this it will redirect to admin login page.


<?php

//logout.php

session_start();

session_destroy();

header('location:login.php');

?>


verify_email.php


This PHP file mainly, we use for validate admin email address and user email address which they have enter at the time of registration. In this file we have include Examination class for perform different operation.

This file will received $_GET['type'] and $_GET['code'] veriable, in $_GET['type'] veriable we can define admin or user, and in $_GET['code'], it will password email verification code. Based on the value of this both variable, it will verify email address.

verify_email.php

<?php

//verify_email.php

include('master/Examination.php');

$exam = new Examination;

if(isset($_GET['type'], $_GET['code']))
{
 if($_GET['type'] == 'master')
 {
  $exam->data = array(
   ':email_verified'  => 'yes'
  );

  $exam->query = "
  UPDATE admin_table 
  SET email_verified = :email_verified 
  WHERE admin_verfication_code = '".$_GET['code']."'
  ";

  $exam->execute_query();

  $exam->redirect('master/login.php?verified=success');
 }
}


?>

Online Examination System has been build by using PHP script with Mysql database, jQuery, Ajax and Bootstrap 4 library. Source of Online Examination system in PHP will be added very soon.






Online Examination System in PHP Video Tutorial


Below you can find video tutorial of PHP Mysql Online Exam System which we have publish. So, If you have miss any tutorial, you can check here.

  1. Introduction - Online Examination System in PHP
  2. Check Unique Admin Email Address - Online Examination System in PHP
  3. Admin Registration - Online Examination System in PHP
  4. Verify Admin Email Address - Online Examination System in PHP
  5. Admin Login Form - Online Examination System in PHP
  6. Display all Exam - Online Examination System in PHP
  7. Schedule New Exam - Online Examination System in PHP
  8. Edit Schedule Exam Details - Online Examination System in PHP
  9. Remove Schedule Exam Details - Online Examination System in PHP
  10. Add Question in Exam - Online Examination System in PHP
  11. Display All Question - Online Examination System in PHP
  12. Edit Question Details - Online Examination System in PHP
  13. Delete Question - Online Examination System in PHP
  14. Check User Unuique Email ID - Online Examination System in PHP
  15. User Registration - Online Examination System in PHP
  16. User Email ID Verification - Online Examination System in PHP
  17. User Login - Online Examination System in PHP
  18. User Profile - Online Examination System in PHP
  19. User Change Password - Online Examination System in PHP
  20. List User Enroll Exam - Online Examination System in PHP
  21. List User List at Master Side - Online Examination System in PHP
  22. View User Details in Modal - Online Examination System in PHP
  23. Admin Side Exam Enroll User list - Online Examination System in PHP
  24. List Question on Starting of Exam - Online Examination System in PHP
  25. Exam Result on Web Page User Side - Online Examination System in PHP
  26. Exam Result in PDF Format - User Side - Online Examination System in PHP
  27. Master Side - Generate Single User Exam Result - Online Examination System in PHP
  28. Admin Side - Generate All User Exam Result - Online Examination System in PHP
  29. Admin Side - Generate All User Exam Result in PDF Format - Online Examination System in PHP




0 comments:

Post a Comment