i have this code for submitting an online exam and i submit this page using javascript xmlhttprequest(pure javascript no Jquery) and i have three parameters the question id arrays and answers and the numbers of rows
<?php
require_once ("../templates/header.php");
?>
<?php
require_once ("../core/initialize.php");
?>
<?php $total_of_questions = null; ?>
<div class="container">
<div>
<span class="total-of-questions" style="margin-right: 10px;font-size: 19px;"> <?php echo $total_of_questions; ?></span>
<span class="exam-time" style="float: left;margin-left: 10px;font-size: 19px;"> : 30 </span>
</div>
<div class="submit-exam-div" id="submit-exam-div">
<?php
if (isset($_POST["exam-submit-button"])) {
$questions_id_array = $_POST["questions_id_array"];
$total_questions = $_POST["rowCount"];
$exam -> correct_exam($questions_id_array, $total_questions);
} // End of submit
?>
</div> <!------End Of Submit Div-------->
<div class="spinner" id="spinner" style="display: none;">
<img src="../multimedia/ajax_spinner/ajax-spinner.gif" />
</div>
<div class="question-div" id="question-div" style="display: block;">
<form action="<?php echo $_SERVER["PHP_SELF"]; ?>" method="post" id="exam-form" name="exam-form">
<?php
//$question_type_id = 2 ;
//$question_type_id = isset($_GET["question_type_id"]) ? $_GET["question_type_id"] : false ;
$question = $exam->find_question_for_exam(2);
$rowCount = $question->rowCount();
$total_of_questions = $question->columnCount();
$question_rows = $question->fetchAll(PDO::FETCH_CLASS,"Exam");
$question_number = 1 ;
foreach ($question_rows as $question_row ):?>
<hr style="border: 1px dotted #E38D33; width: auto; "/>
<ol>
<p style="font-size: 19px;margin-right:10px; margin-bottom: 10px;"> <?php echo $question_number; ?> # </p>
<p style="font-size: 22px;"><?php echo $question_row -> question_text; ?></p>
<?php $question_number++; ?>
<?php
// Get answers from Database
$answer = $exam->find_answer_for_question($question_row->question_id);
$answer_rows = $answer->fetchAll(PDO::FETCH_CLASS,"Exam");
foreach ($answer_rows as $answer_row):?>
<li style="font-size: 20px;"><input type="radio" name="answer<?php echo $question_row -> question_id; ?>" value="<?php echo $answer_row -> answer_text; ?>" />
<?php echo $answer_row -> answer_text . "<br />"; ?></li>
<?php endforeach ; // End foreach for answers fetch ?>
<li><input type="hidden" name="questions_id_array[]" value="<?php echo $question_row -> question_id; ?>" ></li>
</ol>
<?php endforeach ; // End foreach for questions fetch ?>
<hr style="border: 1px dotted #E38D33; width: auto; "/>
<input type="hidden" name="rowCount" value="<?php echo $rowCount; ?>" >
<!---<input type="submit" name="question_submit" id="question-submit" value=" " />---->
<button name="exam-submit-button" id="exam-submit-button" > </button>
</form>
</div> <!------End of question DIV----------->
</div> <!------End of container DIV----------->
<?php //require_once ("../templates/footer.php"); ?>
<script type="text/javascript">
var spinner = document.getElementById("spinner");
function showSpinner() {
spinner.style.display = "block";
}
function hideSpinner() {
spinner.style.display = "none";
}
function submitExam() {
var xmlhttp;
var submit_exam_div = document.getElementById("submit-exam-div");
var answer = document.getElementById("answer").value;
var questions_id = document.getElementById("questions_id_array").value;
var row_count = document.getElementById("rowCount").value;
var input_parameters = "answer=" + answer + "&questions_id=" + questions_id + "&row_count=" + row_count;
xmlhttp = new XMLHttpRequest();
xmlhttp.open("POST", "exam.php", true);
xmlhttp.setRequestHeader("Content-Type,application/x-www-form-urlencoded; charset=UTF-8");
xmlhttp.onreadystatechange = function() {
if (xmlhttp.readyState == 2) {
showSpinner();
}
if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
hideSpinner();
submit_exam_div.innerHTML = xmlhttp.responseText;
}
};
xmlhttp.send(input_parameters);
}
var question_submit = document.getElementById("exam-submit-button");
question_submit.addEventListener("click", submitExam);
function hideQuestionDiv() {
var question_div = document.getElementById("question-div");
if (question_div.style.display = "block") {
question_div.style.display = "none";
return true;
} else {
question_div.style.display = "block";
return false;
}
}
var button = document.getElementById("exam-submit-button")
button.addEventListener("click", hideQuestionDiv);
</script>
<pre>
<?php print_r($_POST); ?>
</pre>
1 Answer(s)