I am creating an online quiz system, where i am taking questions along with there options from getquestion.php using ajax on quiz.html, i have added next and previous button on quiz.html, when user select an answer and hit next it goes to the second question, but when user hit previous button i want to show the previously selected option which user selected before hit next button. i tried but code is not working please help me i am new with this.
quiz.html
<div id='questionArea' style="position:absolute;top:30%;left:1%;"></div>
<button id='next' type="submit" style="position:absolute;top:50%;left:1%;padding:5px;width:80px;background-color:silver;border:1px solid grey;color:white;border-radius:20%;cursor:pointer;">Next</button><button id='prev' type="submit" style='display: none;position:absolute;top:50%;left:10%;padding:5px;width:80px;background-color:silver;border:1px solid grey;color:white;border-radius:20%;cursor:pointer;'>Previous</button>
<script>
$(document).ready(function() {
var number = 0;
$.post('getquestion.php', {number: number}, function(result){
$('#questionArea').html(result);
});
$('#next').click(function() {
number = number + 1;
if (number => 1){
$('#prev').css('display','block');
}
$.post('getquestion.php', {number: number}, function(result){
$('#questionArea').html(result);
});
});
$('#prev').click(function() {
number = number - 1;
if (number < 1){
$('#prev').css('display','none');
}
$.post('getquestion.php', {number: number}, function(result){
$('#questionArea').html(result);
});
});
});getquetion.php
if(isset($_POST['number'])){
$number = $_POST['number'];
}
$sql="SELECT * FROM `questions`";
$result=mysqli_query($conn,$sql);
$qid = array();
$question = array();
$chA = array();
$chB = array();
$chC = array();
$chD = array();
while ($row = mysqli_fetch_assoc($result)) {
$qid[] = $row['question_id'];
$question[] = $row['question'];
$chA[] = $row['ansa'];
$chB[] = $row['ansb'];
$chC[] = $row['ansc'];
$chD[] = $row['ansd'];
$correct = $row['correct_ans'];
}
echo "<div id='question'>".$qid[$number].")"." ". $question[$number] . "</div>";
echo "<input id='a' type='radio' name='a' value='" . $chA[$number] ."'> " . $chA[$number] . "<br>";
echo "<input id='b' type='radio' name='a' value='" . $chB[$number] ."'> " . $chB[$number] . "<br>";
echo "<input id='c' type='radio' name='a' value='" . $chC[$number] ."'> " . $chC[$number] . "<br>";
echo "<input id='d' type='radio' name='a' value='" . $chD[$number] ."'> " . $chD[$number] . "<br>";
?>
<!doctype html>
<html>
<head></head>
<body>
<script>
var value;
$("#a").click(function(){
value = $(this).val();
});
$("#b").click(function(){
value = $(this).val();
});
$("#c").click(function(){
value = $(this).val();
});
$("#d").click(function(){
value = $(this).val();
});
$('#prev').click(function(){
if(value == "something that user selects before"){
$('#').prop("checked",true);
}else{
$('#').prop("checked",false);
}
});
</script>
</div>
