เพื่อให้รองรับกับวันพ่อที่กำลังจะมาถึงนี่ ผมเลยหยิบวิธีการสร้างหน้าเว็บเพจสำหรับการลงนามถวายพระพร ด้วยภาษา PHP เชื่อมต่อกับฐานข้อมูล MySQL แบบง่ายๆไม่ยากเย็นอะไร มาเป็นไอเดียให้ลองใช้ศึกษาดูกันนะครับ
ลงนาม
มาเริ่มกันเลยนะครับ เพื่อไม่ให้เป็นการเสียเวลา
ก่อนอื่นผมวางแปลนเอาไว้แบบง่ายๆคือ จากเว็บหลักเข้ามาเป็น Landing Page เพื่อส่ง Link เข้ามายังหน้าของการเลือกเพื่อที่จะเข้าสู่การลงนามถวายพระพรกันก่อน ซึ่งตรงนี้เป็น HTML กับรูปภาพธรรมดานะครับ ไม่มีอะไรมาก
หน้าแรก
ตัวอย่าง Code นะครับ
<body background=”images/bg.jpg”>
<table align=”center” width=”80%” border=”0″ cellpadding=”0″ cellspacing=”0″>
<tr align=”center”>
<td><img src=”images/main.jpg” /></td>
</tr>
<tr align=”center”>
<td><font size=”+1″>[ <a href="post.php">ลงนามถวายพระพร</a> ]</font></td>
</tr>
<tr align=”center”>
<td>
<a href=”http://www.ptechcom.net”>[ สาขาคอมพิวเตอร์ ]</a>
<a href=”http://www.p-tech.ac.th”>[ เว็บโรงเรียน Ptech]</a>
</td>
</tr>
</table>
หน้าที่สอง เมื่อคลิกลิงค์ ลงนามถวายพระพร ก็จะวิ่งไปที่หน้าสำหรับโพสข้อความ
Post
เป็นการสร้างฟอร์มใหญ่ๆ เพื่อพิมพ์ข้อความและกล่องข้อความขนาดเล็กเพื่อรับชื่อ ส่วนด้านล่างผมก็ทำเป็นการดึงข้อความออกมาจากฐานข้อมูล
<form action=”posted.php” method=”post”>
<table width=”70%” align=”center” border=”0″ cellpadding=”0″ cellspacing=”0″>
<tr>
<td colspan=”2″ align=”center”>
</td>
</tr>
<tr align=”center”>
<td>
<textarea cols=”70″ rows=”10″ name=”dad_text”></textarea><br /><br />
<font size=”-1″><i>
ด้วยเกล้าด้วยกระหม่อมขอเดชะ ข้าพระพุทธเจ้า<br />
</i></font>
<input type=”text” name=”dad_name” size=”35″ /> <br /><br />
<input type=”submit” value=”ลงนาม” />
<input type=”reset” value=”ยกเลิก” />
</td>
</tr>
</table>
</form>
แล้วฟอร์มนี้จะส่งข้อมูลข้ามไปยังอีกหน้าเพื่อทำการยัดลงฐานข้อมูลนะครับ
ในหน้านี้คือจะมีการดึงข้อมูลออกมาจากฐานข้อมูลด้วยในส่วนล่าง
<?php
$con = mysql_connect(“localhost”,”root”,”root”);
mysql_select_db(“test”,$con);
#เชื่อมต่อฐานข้อมูล
if (isset ($_GET['page'] ) ) {
$current_page = $_GET['page'];
} else{
$current_page = 1;
}
$page_size = 10 ; #จำนวนของแถวข้อมูลที่ต้องการให้แสดง
$start_art = ( $current_page-1 ) * $page_size;
$sql = “SELECT * FROM dad ORDER BY dad_id DESC LIMIT $start_art, $page_size”;
#ดึงข้อมูลออกมาด้วย SQL
$result = mysql_query($sql);
while ($data = mysql_fetch_array($result) ) {
?>
<tr>
<td bgcolor=”#FFFFFF”>
<font size=”-1″ color=”#990000″>ข้อความ ::</font>
<br />
<?php echo $data['dad_text']; ?>
<br />
<font size=”-1″>ด้วยเกล้าด้วยกระหม่อมขอเดชะ ข้าพระพุทธเจ้า ::
<?php echo $data['dad_name']; ?>
</font>
<?php
echo “<hr width=’95%’ />”;
}
$result = mysql_query (“SELECT COUNT(*) FROM dad”);
$num_rows = mysql_result ($result,0,0); #นับข้อมูลเพื่อแบ่งเพจ
$num_pages = ceil($num_rows/$page_size);
if($current_page !=1) {
$prev_page = $current_page – 1;
echo “<a href=\” “. $_SERVER['PHP_SELF'] . “?”;
echo “page=$prev_page\”><font size=-1><b>ข้อความก่อนหน้า</b></font></a>”;
}
echo ” <font size=-1><b>ข้อความก่อนหน้า: $current_page From $num_pages</b></font> “;
if ($current_page < $num_pages) {
$next_page = $current_page + 1;
echo “<a href=\” “. $_SERVER['PHP_SELF'] . “?”;
echo “page=$next_page\”><font size=-1><b>ข้อความถัดไป</a>”;
echo “</font></b>”;
}
?>
ด้านบนนี้มีข้อมูลเยอะนะครับ ที่สำคัญๆก็จะเป็นส่วนของการดึงข้อมูลออกมา และมีการแบ่งหน้าเพจด้วย ผมวางไว้ด้านบนนะครับ ถ้าอธิบายไม่ละเอียดจะมาเพิ่มเติมในส่วนของการแบ่งเพจการแสดงข้อมูลให้เพิ่มเติมคราวหน้า
และหน้าสุดท้ายนะครับก็จะเป็นแค่หน้าที่ Insert ข้อมูลลงฐานข้อมูลเท่านั้นเอง และตั้งให้มีการ redirect พากลับมายังหน้า Post ใหมอีกครั้งนะครับ
<meta http-equiv=”refresh” content=”5;URL=post.php” />
<?php
$dad_text = $_POST[dad_text];
$dad_name = $_POST[dad_name];
$con = mysql_connect(“localhost”,”root”,”root”);
mysql_query (“USE test;”);
$sql = “INSERT INTO dad VALUES
(”,’$dad_text’,'$dad_name’)”;
mysql_query(“$sql”);
?>
บรรทัดบนสุดคือการสั่ง refresh นะครับแล้วด้านล่างคือการนำข้อมูลลงฐานข้อมูลไปด้วยคำสั่ง Insert ธรรมดา
ก็แบบง่ายๆก็จะมีเท่านี้นะครับเอาเป็นว่าพอเป็นแนวทางได้ คงไม่ถึงกับสวยงามหรือเท่ห์อะไรมากนะครับ
มีตัวอย่าง Code มาให้ดาวน์โหลดไปลองศึกษาเล่นกันดูนะครับ
#1 by waraluk on 12/06/2011 - 7:27 am
ขอบคุณนะคะ ได้ประโยชน์มากเลยคะ ตรงกับวันสำคัญพอดี…..ต่อไปต้องพัฒนาเป็นวันแม่ซะแลัว ^ ^
#2 by Achita Kanasiri on 01/22/2012 - 9:43 am
ขอเป็นไฟล์มาศึกษาได้ไหมคับเพื่อเอามาพัฒนาต่อ ในเรื่องอื่น ๆ
#3 by teerapuch on 01/22/2012 - 12:34 pm
ได้เลยครับ งั้นผมจะแปะตัวอย่าง Code ไว้ให้ด้านบนนะครับ เข้ามาดาวน์โหลดไปแล้วก็บอกกันบ้างแล้วกัน
#4 by ฝขว.ร.๕ พัน.๑ on 02/23/2012 - 1:27 am
1.ขอให้พระองค์ทรงพระเจริญ
2.ขอพระองค์ทรงพระเจริญยิ่งยืนนาน
3.ขอพระองค์อยู่คู่แผ่นดินไทยตลอดไป
4.ขอพระองค์ทรงมีพระพลานามัยที่สมบูรณ์
5.ขอพระองค์ทรงอยู่คู่ฟ้าแผ่นดินสยามยิ่งยืนนาน
6.ขอให้พระองค์อยู่เป็นร่มโพธิ์ร่มไทรให้กับปวงประชาไทยตลอดกาลนานเทอญ
7.ทรงพระเกษมสำราญ
8.เรารักในหลวง สมเด็จพระนางเจ้าสิริกิติ์ พระบรมราชินีนาถ
9.ขอองค์ท่านอยู่คู่ฟ้าแผ่นดินสยามยิ่งยืนนาน ขอองค์ท่านมีพระพลานามัยแข็งแรง
10.ขอพระองค์ทรงหายจากอาการพระประชวรเร็ววัน
11.ขอให้สิ่งศักดิ์สิทธิ์ทั้งหลายในสากลโลกปกปักษ์รักษาพระองค์ให้รอดปลอดภัยจากอันตรายทั้งปวง
12.ขอให้พระองค์อยู่เป็นเสาหลักแห่งสยามประเทศต่อไปตลอดกาล
13.ข้าพเจ้าขอสัญญาว่าจะเป็นคนดีและเป็นพลเมืองที่ดีของครอบครัว สังคม และประเทศชาติ
14.ขอให้พระองค์ทรงปราศจากโรคภัยไข้เจ็บทุกประการ
15.ขอให้พระองค์จงมีความสุข ตลอดไป