0% found this document useful (0 votes)
2 views2 pages

Correct

The document outlines updates made to a quiz application, including explicit question numbering, improved auto-save functionality with error handling, and immediate visual feedback for answered questions. Key changes also include proper session handling in the save_answer.php script and enhanced CSS for visual indicators of answered questions. Additionally, troubleshooting tips are provided for potential auto-save issues.

Uploaded by

Saifullahi Auwal
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
2 views2 pages

Correct

The document outlines updates made to a quiz application, including explicit question numbering, improved auto-save functionality with error handling, and immediate visual feedback for answered questions. Key changes also include proper session handling in the save_answer.php script and enhanced CSS for visual indicators of answered questions. Additionally, troubleshooting tips are provided for potential auto-save issues.

Uploaded by

Saifullahi Auwal
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
You are on page 1/ 2

Here's the corrected code with working auto-save and question numbering:

1. Updated Quiz Page (quiz.php):


```php
<!-- Add this in the question display section -->
<div class="question">Question <?= $current_q ?>: <?= $question['question']
?></div>
```

2. Updated JavaScript in quiz.php:


```javascript
// Updated auto-save code with error handling
document.querySelectorAll('input[type=radio]').forEach(input => {
input.addEventListener('change', () => {
const data = {
subject: '<?= $current_subject ?>',
question: <?= $current_q ?>,
answer: input.value
};

fetch('save_answer.php', {
method: 'POST',
headers: {
'Content-Type': 'application/json',
},
body: JSON.stringify(data)
})
.then(response => {
if (!response.ok) {
console.error('Save failed');
}
// Update answered indicator immediately
const questionLink = document.querySelector(`a[href="?subject=<?=
$current_subject ?>&q=<?= $current_q ?>"]`);
if (questionLink) {
questionLink.classList.add('answered');
}
})
.catch(error => console.error('Error:', error));
});
});
```

3. Updated save_answer.php:
```php
<?php
include 'config.php';

// Get POST data


$data = json_decode(file_get_contents('php://input'), true);

if (isset($data['subject'], $data['question'], $data['answer'])) {


// Initialize subject array if not exists
if (!isset($_SESSION['answers'][$data['subject']])) {
$_SESSION['answers'][$data['subject']] = [];
}

// Save answer
$_SESSION['answers'][$data['subject']][(int)$data['question']] =
$data['answer'];

// Immediately write and close session to prevent locking


session_write_close();
echo json_encode(['status' => 'success']);
} else {
http_response_code(400);
echo json_encode(['status' => 'invalid data']);
}
?>
```

4. Add this CSS to properly show answered questions:


```css
.answered {
background: #4CAF50 !important;
color: white;
border-radius: 50%;
width: 25px;
height: 25px;
display: flex;
align-items: center;
justify-content: center;
}
```

Key changes made:


1. Added explicit question numbering in the display
2. Improved error handling in the fetch call
3. Added immediate visual feedback when answering questions
4. Proper session handling in save_answer.php
5. Better visual indicators for answered questions
6. Session write close to prevent locking issues

To make the question numbers appear:


```php
<!-- In the question display section -->
<div class="question">
<h3>Question <?= $current_q ?> of <?= $limit ?> (<?= $current_subject ?>):</h3>
<?= $question['question'] ?>
</div>
```

If the auto-save still doesn't work, check:


1. Browser console for errors (F12 Developer Tools)
2. Network tab to see if save_answer.php requests are successful
3. File permissions on the server
4. Session storage path permissions
5. Ensure PHP sessions are properly configured

The questions are now numbered both in the main display and in the navigation bar.
Answered questions will immediately show with a green indicator in the question
navigation bar.

You might also like