File "mr_test.php"
Full Path: /home/ccipcixf/public_html/miportal/mr_test.php
File size: 12.51 KB
MIME-type: text/x-php
Charset: utf-8
<?php
session_start();
include("admin/includes/config.php"); // Include your PDO configuration
// Ensure the user is logged in
if (!isset($_SESSION['user_acc_id'])) {
die("Unauthorized access. Please log in first.");
}
$user_id = $_SESSION['user_acc_id'];
try {
// Query to check if the user has already attempted and qualified for the test
$query = "SELECT status FROM mystery_shopper_certification WHERE user_id = :user_id LIMIT 1";
$stmt = $pdo->prepare($query);
$stmt->execute(['user_id' => $user_id]);
$user_attempt = $stmt->fetch();
// If user is "Qualified," prevent test retake; if "Not Qualified," allow retake
if ($user_attempt && $user_attempt['status'] === 'Qualified') {
$status_message = "You have already passed the test and are qualified as a Mystery Shopper.";
echo "<div style='text-align: center; margin-top: 50px;'>
<h3>Test Access Restricted</h3>
<p>$status_message</p>
<a href='user_dashboard.php' class='btn btn-primary'>Return to Dashboard</a>
</div>";
exit; // Prevents further code execution if the user has already qualified
}
// If "Not Qualified," allow the user to reattempt the test (no need to display a message here)
} catch (PDOException $e) {
error_log("Query error: " . $e->getMessage());
die("An error occurred. Please try again later.");
}
// If no "Qualified" record is found, show the test form here
?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Market Research Certification Test</title>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/5.1.0/css/bootstrap.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/4.1.1/animate.min.css">
<style>
/* Custom styles for unique quiz UI */
body {
background: linear-gradient(135deg, #73a5ff, #5477f5);
font-family: 'Roboto', sans-serif;
color: #333;
}
.container {
max-width: 600px;
background: #fff;
padding: 30px;
border-radius: 15px;
box-shadow: 0px 8px 20px rgba(0, 0, 0, 0.2);
margin-top: 30px;
}
h2 {
color: #3b3f6e;
font-weight: 700;
text-align: center;
}
p {
color: #555;
text-align: center;
font-size: 1.1em;
}
.question {
display: none;
opacity: 0;
transition: opacity 0.5s ease-in-out;
}
.question.active {
display: block;
opacity: 1;
animation: fadeIn 0.5s ease-in-out;
}
@keyframes fadeIn {
from {
opacity: 0;
transform: translateY(10px);
}
to {
opacity: 1;
transform: translateY(0);
}
}
.navigation-buttons {
text-align: center;
margin-top: 30px;
}
.navigation-buttons button {
width: 120px;
margin: 5px;
border-radius: 25px;
font-weight: bold;
transition: all 0.3s;
}
.btn-primary:hover,
.btn-secondary:hover {
transform: scale(1.05);
box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.2);
}
#result {
text-align: center;
margin-top: 30px;
}
.progress-bar {
height: 10px;
border-radius: 5px;
background: #73a5ff;
transition: width 0.3s ease-in-out;
}
</style>
</head>
<body>
<div class="container mt-5">
<h2>Market Research Certification Test</h2>
<p>Answer each question carefully to proceed.</p>
<!-- Progress bar -->
<div class="progress my-3">
<div class="progress-bar" id="progress-bar" role="progressbar" style="width: 10%;"></div>
</div>
<div class="row">
<div class="col-md-12">
<form id="certification-form" action="mr_submit_certification.php" method="POST">
<!-- Actual questions and answers -->
<div class="question active" id="question-1">
<h5>Q1. Why is it important to be honest when answering a survey?</h5>
<label><input type="radio" name="q1" value="A"> A) It doesn’t matter as long as the answer is close</label><br>
<label><input type="radio" name="q1" value="B"> B) It ensures that the feedback is valuable and helps companies make informed decisions</label><br>
<label><input type="radio" name="q1" value="C"> C) Because surveys are mandatory</label><br>
<label><input type="radio" name="q1" value="D"> D) To make the survey look better</label>
</div>
<div class="question" id="question-2">
<h5>Q2. If you are unsure about a question in a survey, what should you do?</h5>
<label><input type="radio" name="q2" value="A"> A) Skip the question</label><br>
<label><input type="radio" name="q2" value="B"> B) Guess an answer</label><br>
<label><input type="radio" name="q2" value="C"> C) Provide your best guess based on assumptions</label><br>
<label><input type="radio" name="q2" value="D"> D) Select "I don't know" or leave it blank if available</label>
</div>
<div class="question" id="question-3">
<h5>Q3. How should you approach open-ended questions in surveys?</h5>
<label><input type="radio" name="q3" value="A"> A) Answer them as quickly as possible</label><br>
<label><input type="radio" name="q3" value="B"> B) Give detailed, clear, and relevant feedback</label><br>
<label><input type="radio" name="q3" value="C"> C) Provide only one word responses</label><br>
<label><input type="radio" name="q3" value="D"> D) Ignore them if you don't have an opinion</label>
</div>
<div class="question" id="question-4">
<h5>Q4. When rating your experience on a scale of 1-5, which of the following is best?</h5>
<label><input type="radio" name="q4" value="A"> A) Always give a 5, even if you’re unsure</label><br>
<label><input type="radio" name="q4" value="B"> B) Select a number that truly reflects your experience</label><br>
<label><input type="radio" name="q4" value="C"> C) Select the middle option for all questions</label><br>
<label><input type="radio" name="q4" value="D"> D) Only choose extreme answers (1 or 5) to appear helpful</label>
</div>
<div class="question" id="question-5">
<h5>Q5. Which of the following is a common mistake when completing an online survey?</h5>
<label><input type="radio" name="q5" value="A"> A) Providing truthful and accurate answers</label><br>
<label><input type="radio" name="q5" value="B"> B) Rushing through the questions without considering the answers</label><br>
<label><input type="radio" name="q5" value="C"> C) Taking your time and reading each question carefully</label><br>
<label><input type="radio" name="q5" value="D"> D) Skipping any questions you don’t understand</label>
</div>
<div class="question" id="question-6">
<h5>Q6. What should you do if you don’t understand a question in the survey?</h5>
<label><input type="radio" name="q6" value="A"> A) Answer based on what you think the question is asking</label><br>
<label><input type="radio" name="q6" value="B"> B) Skip the question and move on</label><br>
<label><input type="radio" name="q6" value="C"> C) Give a vague response</label><br>
<label><input type="radio" name="q6" value="D"> D) Ask the survey administrator for help</label>
</div>
<!-- Continue adding questions similarly up to question 10 -->
<div class="navigation-buttons">
<button type="button" class="btn btn-secondary" onclick="prevQuestion()" id="prev-btn" style="display: none;">Previous</button>
<button type="button" class="btn btn-primary" onclick="nextQuestion()" id="next-btn">Next</button>
<button type="submit" class="btn btn-success" id="submit-btn" style="display: none;">Submit</button>
</div>
</form>
</div>
</div>
<div id="result" class="mt-4" style="display: none;">
<h4>Thank you for your response!</h4>
<p>We have recorded your answers.</p>
</div>
</div>
<script>
let currentQuestion = 1;
const totalQuestions = 6;
function showQuestion(questionNum) {
document.querySelectorAll('.question').forEach(q => q.classList.remove('active'));
document.getElementById(`question-${questionNum}`).classList.add('active');
// Update progress bar
const progressPercent = (questionNum / totalQuestions) * 100;
document.getElementById('progress-bar').style.width = progressPercent + '%';
// Handle button visibility
document.getElementById('prev-btn').style.display = questionNum > 1 ? 'inline-block' : 'none';
document.getElementById('next-btn').style.display = questionNum < totalQuestions ? 'inline-block' : 'none';
document.getElementById('submit-btn').style.display = questionNum === totalQuestions ? 'inline-block' : 'none';
}
function nextQuestion() {
if (validateAnswer()) {
currentQuestion++;
showQuestion(currentQuestion);
} else {
alert("Please select an answer before proceeding.");
}
}
function prevQuestion() {
currentQuestion--;
showQuestion(currentQuestion);
}
function validateAnswer() {
const questionName = `q${currentQuestion}`;
return document.querySelector(`input[name="${questionName}"]:checked`) !== null;
}
function validateAllAnswers() {
for (let i = 1; i <= totalQuestions; i++) {
const questionName = `q${i}`;
if (document.querySelector(`input[name="${questionName}"]:checked`) === null) {
return false;
}
}
return true;
}
document.getElementById('certification-form').addEventListener('submit', function(event) {
event.preventDefault(); // Prevents page from refreshing
// Check if all questions have been answered
if (validateAllAnswers()) {
// Display the thank-you message
document.getElementById('result').style.display = 'block';
document.getElementById('certification-form').style.display = 'none';
// Optionally, send data to the server using AJAX if desired (instead of form submission)
const formData = new FormData(this);
fetch('mr_submit_certification.php', {
method: 'POST',
body: formData
}).then(response => response.text())
.then(data => console.log(data))
.catch(error => console.error('Error:', error));
} else {
alert("Please answer all questions before submitting.");
}
});
// Initialize the first question
showQuestion(currentQuestion);
</script>
</body>
</html>