ระบบตรวจสอบผลการเรียนออนไลน์ (กรณีศึกษา)
สำหรับกรณีศึกษานี้มีแนวคิดมาจากการทำเพจสำหรับในนักศึกษาตรวจสอบผลการเรียนในรายวิชาที่สอน โดยมีรูปแบบคือออกแบบฟอร์มให้นักศึกษากรอกรหัสประจำตัวจากนั้นกดปุ่ม submit ส่งรหัสประจำตัวจากฟอร์มไปยังสคริปต์ PHP ทำการตรวจสอบรหัสประจำตัวในฐานข้อมูล MySQL ถ้าหากตรงกับที่ป้อนเข้ามาก็จะนำเกรดมาแสดงให้ทราบ แต่ถ้าหากไม่ตรงก็ alert รายงานความผิดพลาด คลิกดูการทำงาน
กรณีป้อนรหัสประจำตัวไม่ถูกต้อง กรณีรหัสประจำตัวเป็นช่องว่าง
 
ถ้าหากรหัสประจำตัวถูกต้อง ก็จะแสดงผลดังนี้
โค้ดโปรแกรมทั้งหมด
ไฟล์ checkgrade.html
<HTML>
<HEAD>
<TITLE> Login </TITLE>
</HEAD>
<BODY>
<center>
<table style="border:2px dotted blue"><center>
<tr><td><img src="image2.gif" border="0" align="left"><h3 align="center"> <font color="red">ผลการเรียนวิชาโครงสร้างข้อมูลและขั้นตอนวิธี</font></h3></td></tr>
<tr><td align="center"><font size=2>ยินดีต้อนรับเข้าสู่ระบบการตรวจสอบผลการเรียน วิชาโครงสร้างข้อมูลและขั้นตอนวิธี (Data Structure & Algorithm) รหัสวิชา 3901-2002</td></tr>
<tr><td align="center"><font size=2>กรุณาป้อนรหัสนักศึกษา 10 หลัก แล้วคลิกปุ่ม ตรวจผลการเรียน</font></td></tr>
<tr><td align="center"><font color="red">ป้อนรหัสตัวอย่าง 5039011273 ในช่อง</font></td></tr>
<tr><td align="center"><form method="post" action="responsegrade.php">
<br><br>
<input type="text" name="studcode" size="10" maxlength="10"><p>
<input type="submit" value="ตรวจผลการเรียน">
<input type="reset" value="เริ่มใหม่"></td></tr>
</form>
</table>
<br>
<<a href="../../index.php">Back</a>
</center>
</BODY>
</HTML>
ไฟล์ responsegrade.php
<?php
//กำหนดตัวแปรเพื่อนำไปใช้งาน
$hostname = "localhost"; //ชื่อโฮสต์
$user = ""; //ชื่อผู้ใช้
$password = ""; //รหัสผ่าน
$dbname = "mydb"; //ชื่อฐานข้อมูล
$tblname = "student2"; //ชื่อตาราง
$s_id="";
$s_name="";
$s_status="";
// เริ่มติดต่อฐานข้อมูล
mysql_connect($hostname, $user, $password) or die("ติดต่อฐานข้อมูลไม่ได้");
// เลือกฐานข้อมูล
mysql_select_db($dbname) or die("เลือกฐานข้อมูลไม่ได้");
$scode=$_POST['studcode'];
if ($scode != "") {
$sql = "select * from $tblname where studcode='$scode'";
$db_query = mysql_db_query($dbname, $sql);
if (!$db_query) {
echo("<b><font size=3>เอ็กซิคิวต์คำสั่ง SQL ไม่ได้ </b></font>" . mysql_error() );
exit;
}
else {
$nums_rows = mysql_num_rows($db_query);
for ($i=0;$i<$nums_rows;$i++) {
$result = mysql_fetch_array($db_query);
$s_id = $result['studcode'];
$s_name = $result['studname'];
$s_mark = $result['mark'];
$s_status = $result['status'];
$s_grade = $result['gradexml'];
}
if ($s_id==$scode) {
echo "<center>";
echo "<h1>ประกาศผลการเรียน</h1>";
echo " <b>รายวิชา : โครงสร้างข้อมูลและขั้นตอนวิธี ภาคเรียนที่ 2/2551<br>";
echo "<table border='1'>";
echo "<tr><td width=150 align='center'>รหัสประจำตัวนักศึกษา</td><td width=200 align='center'>ชื่อ-นามสกุล</td><td width=150 align='center'>ผลการเรียน (เกรด)</td></tr>";
echo " <tr><td align='center'>$s_id</td><td align='center'>$s_name</td align='center'><td>$s_grade</td></tr>";
echo "</table><br>";
echo "โปรดตรวจสอบข้อมูลที่ถูกต้องกับงานทะเบียนอีกครั้ง<br>";
echo "<a href='checkgrade.html'>back</a>";
}
else {
echo "<html>
<head>
<script language='javascript'>
alert('รหัสนักศึกษาไม่ถูกต้อง')
window.location='checkgrade.html'
</script>
</head>
</html>";
exit;
}
}
mysql_close();
}
else {
echo "<html>
<head>
<script language='javascript'>
alert('รหัสนักศึกษาต้องไม่เป็นช่องว่าง')
window.location='checkgrade.html'
</script>
</head>
</html>";
}
?>
สำหรับตาราง ที่จัดเก็บผลการเรียนชื่อ student2 ในฐานข้อมูลMySQL มีโครงสร้างดังนี้
ข้อมูลที่จัดเก็บ (ตัวอย่าง)
ทุกอย่างทำงานได้ดีครับ ก็ได้ใช้โปรแกรมนี้มาหลายปี ต่อไปเราจะดูการปรับปรุงโดยใช้เทคนิค AJAX ให้มีการแสดงผลที่นุ่มนวลขึ้นโดยไม่มีการ Refresh สำหรับระบบที่ปรับปรุงใหม่นี้จะมีไฟล์ทำงานร่วมกัน 3 ไฟล์ได้แก่ grade.php,selusr.js และ membercheck.php โดยการทำงานจะแสดงผลอยู่ที่หน้าเพจ grade.php เพียงหน้าเดียวไม่มีการรีเฟรชหน้า คลิกดูผลการทำงาน
กรณีป้อนหรัสประจำตัวไม่ถูกต้อง
เมื่อป้อนรหัสถูกต้อง
โค้ดของระบบที่ปรับปรุงใหม่เป็นดังนี้ครับ
ไฟล์ grade.php
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> ระบบตรวจสอบผลการเรียน </TITLE>
<meta http-equiv='content-type' content='text/html' charset='windows-874'>
</HEAD>
<script src="selusr.js"></script>
<BODY>
<form name="form1">
<b><font color="red">ระบบตรวจผลการเรียนวิชาโครงสร้างข้อมูลและขั้นตอนวิธี</font></b><br>
<font size="2">กรุณาป้อนรหัสประจำตัว 10 หลัก</font><p>
<input type="text" name="studentid" size="10" maxlength="10">
<input type="button" name="bnt1" value="ตรวจผลสอบ" onclick="checkuser(form1.studentid.value)"> <input type="reset">
</form>
<div id="txtHint"></div>
<a href="../../index.php"><font size="2">Exit</font></a>
</BODY>
</HTML>
ไฟล์ selusr.js
var xmlHttp;
function checkuser(str,pwd)
{
xmlHttp=GetXmlHttpObject()
if (xmlHttp==null)
{
alert ("Browser does not support HTTP Request")
return
}
var url="membercheck.php"
url=url+"?q="+str+"&p="+pwd
url=url+"&sid="+Math.random()
xmlHttp.onreadystatechange=stateChanged
xmlHttp.open("GET",url,true)
xmlHttp.send(null)
}
function stateChanged() {
if (xmlHttp.readyState==4 || xmlHttp.readyState=="complete") {
document.getElementById("txtHint").innerHTML=xmlHttp.responseText ;
}
}
function GetXmlHttpObject()
{
var xmlHttp=null;
try
{
// Firefox, Opera 8.0+, Safari
xmlHttp=new XMLHttpRequest();
}
catch (e)
{
//Internet Explorer
try
{
xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
}
catch (e)
{
xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
}
}
return xmlHttp;
}
ไฟล์ membercheck.php
<?php
header("Content-Type:text/plain;charset=windows-874");
$q=$_GET["q"];
$con = mysql_connect('localhost', '', '');
if (!$con)
{
die('Could not connect: ' . mysql_error());
}
mysql_select_db("mydb", $con);
$sql="SELECT * FROM student2 WHERE studcode = '".$q."' ";
$result = mysql_query($sql);
while($row = mysql_fetch_array($result))
{
$user= $row['studcode'];
$name=$row['studname'];
$surname= $row['dradealgo'] ;
}
if($user) {
echo "<table border='1'>
<tr>
<th bgcolor='lavender'>รหัสนักศึกษา</th>
<th bgcolor='lavender'>ชื่อ-นามสกุล</th>
<th bgcolor='lavender'>ผลการเรียน</th>
</tr>";
$sql="SELECT * FROM student2 WHERE studcode = '".$q."' ";
$result = mysql_query($sql);
while($row = mysql_fetch_array($result)) {
echo "<tr>";
echo "<td><font size='2'>" . $row['studcode'] . "</td>";
echo "<td><font size='2'>" . $row['studname'] . "</td>";
echo "<td align='center'><font size='2'>" . $row['dradealgo'] . "</td>";
echo "</tr>";
}
echo "</table>";
echo "<br><font size='2'>โปรดตรวจข้อมูลที่ถูกต้องกับงานทะเบียนอีกครั้ง</font>";
}
else {
echo "<b>ไม่มีข้อมูล</b>";
}
mysql_close($con);
?>
จะเห็นว่าระบบใหม่ที่ปรับปรุงขึ้นมีการแสดงผลที่นุ่มนวลขึ้นโดยจะแสดงผลที่หน้าเดียวไม่มีการเปลี่ยนหน้า ที่ยกตัวอย่างไม่ได้อธิบายการทำงานของโค้ด คิดว่าคงจะทำความเข้าใจได้โดยไม่ยากนัก หวังว่าคงจะเป็นประโยชน์สำหรับคุณครูทั้งหลายและผู้ที่สนใจทั่วไปลองนำไปใช้งานดูและปรับแต่งตามต้องการครับ ไม่สงวนลิขสิทธิ์ ขอให้ IT เมืองไทยเราจงเจริญ
|
หน้าแรก
