Untitled

<?php
// Array containing the quiz questions and answers
$quiz = array(
    array(
        'question' => 'What is the capital of France?',
        'choices' => array('A' => 'London', 'B' => 'Paris', 'C' => 'Berlin'),
        'answer' => 'B'
    ),
    array(
        'question' => 'Which planet is known as the "Red Planet"?',
        'choices' => array('A' => 'Venus', 'B' => 'Mars', 'C' => 'Jupiter'),
        'answer' => 'B'
    ),
    array(
        'question' => 'Who painted the Mona Lisa?',
        'choices' => array('A' => 'Leonardo da Vinci', 'B' => 'Vincent van Gogh', 'C' => 'Pablo Picasso'),
        'answer' => 'A'
    ),
    array(
        'question' => 'What is the largest ocean in the world?',
        'choices' => array('A' => 'Pacific Ocean', 'B' => 'Indian Ocean', 'C' => 'Atlantic Ocean'),
        'answer' => 'A'
    ),
    array(
        'question' => 'Which country is known as the "Land of the Rising Sun"?',
        'choices' => array('A' => 'Japan', 'B' => 'China', 'C' => 'Korea'),
        'answer' => 'A'
    ),
);

// Variables to keep track of score and user's answers
$score = 0;
$userAnswers = array();

// Process user's answers if the form is submitted
if ($_SERVER['REQUEST_METHOD'] === 'POST') {
    // Iterate through each question
    foreach ($quiz as $key => $question) {
        // Get the user's selected answer
        $userAnswer = $_POST['question_' . $key];

        // Store the user's answer
        $userAnswers[$key] = $userAnswer;

        // Check if the user's answer is correct
        if ($userAnswer === $question['answer']) {
            $score++;
        }
    }
}
?>

<!DOCTYPE html>
<html>
<head>
    <title>Quiz Bee</title>
    <style>
        /* Add CSS styles for the quiz interface */
        body {
            font-family: Arial, sans-serif;
        }

        h1 {
            text-align: center;
        }

        .quiz-container {
            max-width: 600px;
            margin: 0 auto;
            padding: 20px;
            border: 1px solid #ccc;
            background-color: #f5f5f5;
            border-radius: 5px;
        }

        .question {
            margin-bottom: 10px;
        }

        .choices {
            margin-bottom: 20px;
        }

        .score-container {
            text-align: center;
            margin-top: 30px;
            padding: 10px;
            background-color: #eaeaea;
        }

        .answer-list {
            list-style-type: none;
            padding: 0;
        }

        .answer-list li {
            margin-bottom: 10px;
        }

        .btn-submit {
        display: inline-block;
        padding: 0.5em 1em;
        font-size: 1rem;
        font-weight: 500;
        line-height: 1.5;
        text-align: center;
        white-space: nowrap;
        vertical-align: middle;
        cursor: pointer;
        user-select: none;
        border: 1px solid #007bff;
        color: #007bff;
        background-color: #ffffff;
        border-radius: 0.25rem;
        transition: all 0.3s ease;
        }

        .btn-submit:hover {
        background-color: #007bff;
        color: #ffffff;
        }
    </style>
</head>
<body>
    <div class="quiz-container">
        <h1>Quiz Bee</h1>
        
        <?php if ($_SERVER['REQUEST_METHOD'] === 'POST') { ?>
            <div class="score-container">
                <h2>Your Score: <?php echo $score ; ?>/<?php echo count($quiz); ?></h2>
</div>

<h3>Correct Answers:</h3>
        <ul class="answer-list">
            <?php foreach ($quiz as $key => $question) { ?>
                <li>
                    <?php echo $question['question']; ?><br>
                    Correct Answer: <?php echo $question['answer']; ?><br>
                    Your Answer: <?php echo $userAnswers[$key]; ?>
                </li>
            <?php } ?>
        </ul>
    <?php } else { ?>
        <form method="POST">
            <?php foreach ($quiz as $key => $question) { ?>
                <div class="question">
                    <p><?php echo $question['question']; ?></p>
                    <div class="choices">
                        <?php foreach ($question['choices'] as $choiceKey => $choice) { ?>
                            <input type="radio" name="question_<?php echo $key; ?>" value="<?php echo $choiceKey; ?>" required>
                            <label><?php echo $choiceKey.'. '.$choice; ?></label>
                            <br>
                        <?php } ?>
                    </div>
                </div>
            <?php } ?>
            <input type="submit" class ="btn-submit" value="Submit">
        </form>
    <?php } ?>
</div>
</body>
</html>
Editor is loading...