我建立了一个在线考试门户,其中的问题来自使用php和mysqli的数据库。我通过onclick事件使用ajax在页面上加载这些问题。在onclick函数中,我创建了一个数组,该数组存储用户检查的单选选项并加载下一个问题。
在带有onclick事件的最后一个问题按钮中,该事件已保存,下一步被隐藏,然后出现一个提交按钮,该按钮应采用该问题的单选选项,将其推入数组并转到check.php文件。我已完成除了提交部分外,我无法在数组中插入单选选项并将其发送到php文件中的所有内容。我使用了json.stringify,但它不起作用。我应该尝试其他方法吗?请帮忙。
这是整个HTML代码:-
<h3 class="header">ONLINE EXAM SOFTWARE</h3>
<div style="float:right;">
<p>welcome <?php echo $_SESSION['userUId']; ?> <br>Time Left</p>
<span id="Countdown"></span><br>
<div class="div5">
<p>You are viewing <strong>English Language</strong> section</p><br>
<p>Question Palette:</p>
<div class="container">
<div>
<button type="button" class="btn btn-info custom" onclick="updateQuestion(1)" style="margin-right:16px">1</button>
<button type="button" class="btn btn-info custom" onclick="updateQuestion(2)" style="margin-right:16px">2</button>
<button type="button" class="btn btn-info custom" onclick="updateQuestion(3)" style="margin-right:16px">3</button>
</div><br>
<div>
<button type="button" class="btn btn-info custom" onclick="updateQuestion(4)" style="margin-right:16px">4</button>
<button type="button" class="btn btn-info custom" onclick="updateQuestion(5)" style="margin-right:16px">5</button>
<button type="button" class="btn btn-info custom" onclick="updateQuestion(6)" style="margin-right:16px">6</button>
</div><br>
<div>
<button type="button" class="btn btn-info custom" onclick="updateQuestion(7)" style="margin-right:16px">7</button>
<button type="button" class="btn btn-info custom" onclick="updateQuestion(8)" style="margin-right:16px">8</button>
<button type="button" class="btn btn-info custom" onclick="updateQuestion(9)" style="margin-right:16px">9</button>
</div><br>
<div>
<button type="button" class="btn btn-info custom" onclick="updateQuestion(10)" style="margin-right:16px">10</button>
<button type="button" class="btn btn-info custom" onclick="updateQuestion(11)" style="margin-right:16px">11</button>
<button type="button" class="btn btn-info custom" onclick="updateQuestion(12)" style="margin-right:16px">12</button>
</div><br>
<div>
<button type="button" class="btn btn-info custom" onclick="updateQuestion(13)" style="margin-right:16px">13</button>
<button type="button" class="btn btn-info custom" onclick="updateQuestion(14)" style="margin-right:16px">14</button>
<button type="button" class="btn btn-info custom" onclick="updateQuestion(15)" style="margin-right:16px">15</button>
</div><br>
</div><br><br>
Legend:<br>
<div>
<button type="button" class="btn btn-success btn-md"></button>Answered
<button type="button" class="btn btn-danger btn-md" style="margin-left:16px"></button>Not Answered
</div><br>
<div><button type="button" class="btn btn-warning btn-md"></button>Marked
<button type="button" class="btn btn-info btn-md" style="margin-left:16px"></button>Not visited
</div><br>
<div>
<button type="button" class="btn btn-info btn-sm">Profile</button>
<button type="button" class="btn btn-info btn-sm">Question Paper</button>
</div><br>
<div>
<button type="button" class="btn btn-info btn-sm">Instruction</button>
<button type="Submit" class="btn btn-info btn-sm">Submit</button>
</div>
</div>
</div>
<div class="div1">
<h4>Group</h4>
<button type="button" class="btn btn-primary active">GROUP 1</button>
</div>
<div class="div2">
<h5><strong>SECTIONS</strong></h5>
<button type="button" class="btn btn-primary active">English Language</button>
<button type="button" class="btn btn-primary disabled">Numerical Ability</button>
<button type="button" class="btn btn-primary disabled">Reasoning Ability</button>
</div><br>
<div class="div3">
<p><b>Question type</b>:single<b>|</b><b>Marks</b>:<span id="one">1:00</span>|<b>Neg Marks</b>:<span id="another">0.25</span></p>
<p style="position:absolute;top:10px;right:30px">Elapsed Time: <span id="countdown">1</span>
seconds</p>
</div><br>
<div class="div4">
<strong>Questions</strong><br>
<div style="position:absolute;top:10px;right:10px">
<div class="dropdown">view in:
<button class="btn btn-primary dropdown-toggle" type="button" data-toggle="dropdown">Language
<span class="caret"></span></button>
<ul class="dropdown-menu">
<li><a href="#">English</a></li>
<li><a href="#">Hindi</a></li>
<li><a href="#">Latin</a></li>
</ul>
</div>
</div>
<div class="div7">
<div id="questBox">
<?php
$sql = "SELECT * FROM questionpaper where qno= 1";
$query = mysqli_query($conn, $sql);
if($rows = mysqli_fetch_array($query)){ ?>
<span id="qno"><?php echo $rows['QNo'];?></span>
<p><?php
echo $rows['Question'];
$_SESSION['QNO'] = $rows['QNo'];
$l= $_SESSION['QNO']
?></p>
<form>
<input type="radio" name="op" value="<?php echo $rows['opA']; ?>">A.<?php echo $rows['opA']; ?><br>
<input type="radio" name="op" value="<?php echo $rows['opB']; ?>">B.<?php echo $rows['opB']; ?><br>
<input type="radio" name="op" value="<?php echo $rows['opC']; ?>">C.<?php echo $rows['opC']; ?><br>
<input type="radio" name="op" value="<?php echo $rows['opD']; ?>">D.<?php echo $rows['opD']; ?><br>
</form>
<?php } ?>
</div>
</div>
<button type="button" class="btn btn-info btn-md" id="mark" onclick="loadNextQues(1)">Mark for Review & Next</button>
<button type="button" class="btn btn-info btn-md">Clear Response</button>
<button type="submit" class="btn btn-info btn-md" id="save" style="position:absolute;right:20px;bottom:35px" onclick="loadNextQues(0)">Save and Next</button>
<form action="check.php">
<button type='submit' class="btn btn-info btn-md" id="water" style="visibility:hidden;position:absolute;right:20px;bottom:35px" onclick="Checkanswers()">submit</button>
这是整个脚本代码:-
quesno=1;
function updateQuestion(q){
quesno=q;
console.log(quesno);
url="http://localhost/assignments/load-questions.php?qno="+quesno;
$.get(url,function(data,status){
response=JSON.parse(data);
console.log(response);
var quest="<p>"+response.qno+" "+response.question+"</p>";
quest+="<form>";
quest+="<input type=\"radio\" name=\"op\" value='"+response.opA +"'>A."+response.opA+"<br>";
quest+="<input type=\"radio\" name=\"op\" value='"+response.opB +"'>B."+response.opB+"<br>";
quest+="<input type=\"radio\" name=\"op\" value='"+response.opC +"'>C."+response.opC+"<br>";
quest+="<input type=\"radio\" name=\"op\" value='"+response.opD +"'>D."+response.opD+"<br>";
quest+="</form>";
document.getElementById("questBox").innerHTML=quest;
});
if(quesno == 15){
document.getElementById("mark").style.visibility = 'hidden';
document.getElementById("save").style.visibility = 'hidden';
document.getElementById("water").style.visibility = 'visible';
}
else{
document.getElementById("mark").style.visibility = 'visible';
document.getElementById("save").style.visibility = 'visible';
document.getElementById("water").style.visibility = 'hidden';
}
}
var arr = new Array();
function loadNextQues(flag){
quesno++;
var Selected = document.querySelectorAll('[name="op"]:checked');
if (Selected != null) {
Selected.forEach(function(radio) {
arr.push(radio.value);
});
}
console.log(arr);
if(flag==1){
//add css to the button for review
}
else{
//add css for the button as answered
}
url="http://localhost/assignments/load-questions.php?qno="+quesno;
$.get(url,function(data,status){
response=JSON.parse(data);
console.log(response);
var quest="<p>"+response.qno+" "+response.question+"</p>";
quest+="<form>";
quest+="<input type=\"radio\" name=\"op\" value='"+response.opA +"'>A."+response.opA+"<br>";
quest+="<input type=\"radio\" name=\"op\" value='"+response.opB +"'>B."+response.opB+"<br>";
quest+="<input type=\"radio\" name=\"op\" value='"+response.opC +"'>C."+response.opC+"<br>";
quest+="<input type=\"radio\" name=\"op\" value='"+response.opD +"'>D."+response.opD+"<br>";
quest+="</form>";
document.getElementById("questBox").innerHTML=quest;
});
if(quesno == 15){
document.getElementById("mark").style.visibility = 'hidden';
document.getElementById("save").style.visibility = 'hidden';
document.getElementById("water").style.visibility = 'visible';
}
}
function Checkanswers(){
var Selected = document.querySelectorAll('[name="op"]:checked');
if (Selected != null) {
Selected.forEach(function(radio) {
arr.push(radio.value);
});
}
$.post('check.php', {
data: arr
}, function(response) {
console.log(response);
});
}
这是PHP代码:-
<?php
if(isset($_POST)){
if(isset($_POST['data'])){
$answers = $_POST['data'];
echo $answers;
}}
?>