2014/04/17 簡易的PHP留言板製作教學
最後更新時間：2016/3/17
前言：本簡易留言板使用PDO連結的方式製作，只是用於簡單的教學用途，對於PHP非常熟悉的專業人士可以無視這篇教學文XDDD
資料庫使用：MySQL
教學開始！
第一步：建立資料庫、資料表（不然你資料放哪裡？）
首先進入phpMyAdmin中
1. 左側［新增］建立新資料庫
資料庫名稱：demo
2. 左側［新增］建立新資料表
資料表名稱：guestbook
資料表欄位：4
欄位細節：
id - INT - A_I - //備註 編號
name - TEXT //備註 名稱
content - TEXT //內容
updtime - TIMESTAMP - CURRENT_TIMESTAMP - on update CURRENT_TIMESTAMP //備註 留言時間
或執行SQL語法建表：
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| CREATE TABLE `guestbook` ( | |
| `id` int(11) NOT NULL, | |
| `name` text NOT NULL, | |
| `content` text NOT NULL, | |
| `updtime` timestamp NOT NULL DEFAULT CURRENT_TIMESTAMP ON UPDATE CURRENT_TIMESTAMP | |
| ) ENGINE=InnoDB AUTO_INCREMENT=15 DEFAULT CHARSET=latin1; |
用phpMyAdmin對於初學者來說，真的方便很多！
第二步：建立留言版的PHP程式碼
廢話不多說，直接放上PHP的程式碼：
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <?php | |
| /* guestbook by Kevin Chang */ | |
| // 使用常數定義資料庫相關存取資料 | |
| define('DB_PATH', 'localhost'); // 設定資料庫位置 | |
| define('DB_USER', 'admin'); // 設定資料庫帳號 | |
| define('DB_PASSWORD', '*****'); // 設定資料庫密碼 | |
| define('DB_NAME', 'demo'); // 設定資料庫名稱 | |
| define('DB_TABLE', 'guestbook'); // 設定資料表名稱 | |
| date_default_timezone_set('Asia/Taipei'); // 設定時區 | |
| $link = new PDO( | |
| 'mysql:host='.DB_PATH.';charset=UTF8;dbname='.DB_NAME, | |
| DB_USER, | |
| DB_PASSWORD | |
| ); // 建立使用PDO方式連線的物件，並放入設定之相關數據 | |
| $query = $link->prepare('SELECT * FROM `'.DB_TABLE.'`'); // 使用prepare函式, 建立查詢資料表的SQL語法 | |
| $query->execute(); // 執行sql語法 - execute(); | |
| $result = $query->fetchAll(PDO::FETCH_OBJ); // 查詢後將全部結果依序存成陣列並回傳 | |
| $data = array( | |
| ':name' => isset($_POST['name']) ? $_POST['name'] : null, | |
| ':content' => isset($_POST['content']) ? $_POST['content'] : null | |
| ); // 宣告POST的內容 | |
| switch($_GET['act']) { | |
| case '': // $_GET['act'] = null, 就不作用 | |
| break; | |
| case 'ins': // $_GET['act'] = ins, 執行新增 | |
| ins($data, $link); | |
| header('Location:guestbook.php'); // 新增完後，跳回主頁 | |
| break; | |
| default: | |
| header('Location:guestbook.php'); // $_GET['act'] = 其他, 就返回主頁 | |
| } | |
| function ins($data, $link) { | |
| $query = $link->prepare(' | |
| INSERT INTO `guestbook` (`name`, `content`) | |
| VALUES (:name, :content) | |
| ;' | |
| ); | |
| $query->execute($data); // 執行 $data | |
| } | |
| ?> |
大部分的地方都有做備註了，如果有錯誤的地方還煩請指正一下XD
需要注意的地方大概就是前面的MySQL登入帳號密碼的部分記得改成自己的！
到這邊PHP程式碼的地方就大致完成啦！
第三步：建立留言版的HTML程式碼(雖然裡面還是有用到PHP)
這邊是HTML5的程式碼：
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!DOCTYPE html> | |
| <html> | |
| <head> | |
| <meta charset="utf-8"> | |
| <title>guestbook</title> | |
| </head> | |
| <body> | |
| <div class="container"> | |
| <div> | |
| <h1>留言板</h1> | |
| <hr> | |
| <?php foreach($result as $i => $v): ?> | |
| <p> | |
| id: <?php echo $v->id; ?> | | |
| name: <?php echo $v->name; ?> | | |
| content: <?php echo $v->content; ?> | | |
| update time: <?php echo $v->updtime; ?> | | |
| <a href="#">編輯</a> | | |
| <a href="#">刪除</a> | |
| </p> | |
| <hr> | |
| <?php endforeach; ?> | |
| </div> | |
| <form method="post" action="?act=ins"> | |
| <div> | |
| <label for="name">name:</label> | |
| <input type="text" name="name"/> | |
| </div> | |
| <div> | |
| <label for="content">content:</label> | |
| <textarea name="content"></textarea> | |
| </div> | |
| <input type="submit" name="submit"/> | |
| </form> | |
| </div> | |
| </body> | |
| </html> |
那就先未完待續囉～
有問題歡迎留言提問！
