ตัวอย่างระบบข้อสอบ online โดยนักเรียน นักศึกษา จะต้อง login ก่อนโดยจะเก็บข้อมูลส่วนตัว และลำดับคำถามไว้ในเซคชั่น
และเพราะว่า php ตั้งเวลาไว้ให้เซคชั่นมีอายุ 20 นาที แต่มีเวลาทำข้อสอบ 120 นาที ทำให้เซคชั่นหมดเวลาไปก่อน จึงต้องใช้ jQuery มาต่ออายุให้เซคชั่นทุกๆ 10 นาที เพื่อรักษาข้อมูลเอาไว้
ไฟล์แสดงข้อสอบ (ใช้จริงๆ ควรแยก javascript ไปไว้ในอีกที่หนึ่ง)
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>ข้อสอบ</title>
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
</head>
<body>
<?php
if (empty($_POST))
{
?>
<div class="container">
<h2>Vertical (basic) form</h2>
<div class="row">
<div class="col-md-2"><b>Stat :</b></div>
<div class="col-md-2" id="startA"></div>
<div class="col-md-2"><b>End :</b></div>
<div class="col-md-2" id="endA"></div>
<div class="col-md-2"><b>Last Update :</b></div>
<div class="col-md-2" id="periodsA"></div>
</div>
<form id="examinationF" action="examination.php" method="post">
<div class="form-group">
<label for="name">Name :</label>
<input type="text" name="name" id="name" class="form-control" placeholder="Enter your name">
</div>
<div class="form-group">
<label for="surname">Surname :</label>
<input type="text" name="surname" id="surname" class="form-control" placeholder="Enter your surname">
</div>
<div class="checkbox">
<label><input type="checkbox" name="accept">พร้อมทำข้อสอบในเวลาที่กำหนด</label>
</div>
<button type="submit" class="btn btn-default">Submit</button>
</form>
</div>
<script src="https://code.jquery.com/jquery-2.1.4.min.js"></script>
<script>
$(function(){
/* keep session */
function sessionPostpone()
{
$.ajax({
"cache" : false,
"type" : "post",
"success" : function(datas)
{
$('#endA').text(datas.time_end);
$('#periodsA').text(datas.update+ '('+datas.periods+')');
$('#startA').text(datas.time_start);
},
"url" : "session.php"
});
}
sessionPostpone();
var interval = 1000 * 60 * 10; // every 10 minutes
setInterval(function(){
sessionPostpone();
}, interval);
/* submit form */
var timeout = 1000 * 60 * 120; // 120 minutes
setTimeout(function () {
$('#examinationF').submit();
}, timeout);
})
</script>
<?php
}
else
{
echo'<h1>คำตอบของคุณคือ</h1>',
'<pre>',print_r($_POST, true),'</pre>';
}
?>
</body>
</html>
ไฟล์ไว้เรียกดูข้อมูล และยืดอายุ session ออกไป
<?php
session_start();
$time = new DateTime();
if(! isset($_SESSION['id']))
{
$datas = [];
$_SESSION['id'] = session_id();
$_SESSION['time_start'] = $time->format('H:i:s');
$time_end = $time->modify('+2 hour');
$_SESSION['time_end'] = $time_end->format('H:i:s');
$_SESSION['time_end_timestamp'] = time($time_end);
}
$period = 10;
$_SESSION['periods'] = round((strtotime($_SESSION['time_end']) - time($time)) / 60 / $period);
$_SESSION['update'] = $time->format('H:i:s');
header("Content-type: application/json; charset=utf-8");
echo json_encode($_SESSION);
About the author