To Design an online quiz timer using JavaScript and PHP:
1) To create a table to store timer in minutes
CREATE TABLE `cnsh_lms`.`edu_tests_extra` (
`test_id` mediumint(8) unsigned NOT NULL auto_increment,
`timer` tinyint(4) unsigned NOT NULL,
`num_timer` bigint(10) unsigned NOT NULL default '0',
PRIMARY KEY (`test_id`)
) ENGINE=MyISAM AUTO_INCREMENT=82 DEFAULT CHARSET=utf8;
2) To display a count down timer, the initialized minutes from $row_2['num_timer'] in above table. When down to 0, the form quiz is submitted.
<div style="font-weight: bold" id="quiz-time-left"></div>
<script type="text/javascript">
var max_time = <?php echo $row_2['num_timer'] ?>;
var c_seconds = 0;
var total_seconds =60*max_time;
max_time = parseInt(total_seconds/60);
c_seconds = parseInt(total_seconds%60);
document.getElementById("quiz-time-left").innerHTML='Time Left: ' + max_time + ' minutes ' + c_seconds + ' seconds';
function init(){
document.getElementById("quiz-time-left").innerHTML='Time Left: ' + max_time + ' minutes ' + c_seconds + ' seconds';
setTimeout("CheckTime()",999);
}
function CheckTime(){
document.getElementById("quiz-time-left").innerHTML='Time Left: ' + max_time + ' minutes ' + c_seconds + ' seconds' ;
if(total_seconds <=0){
setTimeout('document.quiz.submit()',1);
} else
{
total_seconds = total_seconds -1;
max_time = parseInt(total_seconds/60);
c_seconds = parseInt(total_seconds%60);
setTimeout("CheckTime()",999);
}
}
init();
</script>var max_time = <?php echo $row_2['num_timer'] ?>;
var c_seconds = 0;
var total_seconds =60*max_time;
max_time = parseInt(total_seconds/60);
c_seconds = parseInt(total_seconds%60);
document.getElementById("quiz-time-left").innerHTML='Time Left: ' + max_time + ' minutes ' + c_seconds + ' seconds';
function init(){
document.getElementById("quiz-time-left").innerHTML='Time Left: ' + max_time + ' minutes ' + c_seconds + ' seconds';
setTimeout("CheckTime()",999);
}
function CheckTime(){
document.getElementById("quiz-time-left").innerHTML='Time Left: ' + max_time + ' minutes ' + c_seconds + ' seconds' ;
if(total_seconds <=0){
setTimeout('document.quiz.submit()',1);
} else
{
total_seconds = total_seconds -1;
max_time = parseInt(total_seconds/60);
c_seconds = parseInt(total_seconds%60);
setTimeout("CheckTime()",999);
}
}
init();
3) If you click refresh or go to another webpages, the for will be submitted auotomatically
<script type="text/javascript">
function finishpage()
{
alert("unload event detected!");
document.quiz.submit();
}
window.onbeforeunload= function() {
setTimeout('document.quiz.submit()',1);
}
</script>
{
alert("unload event detected!");
document.quiz.submit();
}
window.onbeforeunload= function() {
setTimeout('document.quiz.submit()',1);
}
</script>
4. The form
<form method="post" name="quiz" id="quiz_form" action="take_test1.php" >
</form>
Nice Post! You've said it all wonderful. It is really helpful post for Free Online Quiz Maker.
ReplyDeletethanks
ReplyDeleteI cant implement a timer in my php online examination project pls help.....
Deletenot working plz send me the code
DeleteNice one Finally I got What i want THANK YOU!!!
ReplyDeleteWhere are you putting Script code? Could anyone elaborate?
ReplyDeletegood
ReplyDeleteHow about LAN based exam?
ReplyDeleteThanks Bruh...
ReplyDeleteThanks Bro
ReplyDeletethanku so much
ReplyDelete