Board logo

標題: 11-1-2 留言網頁與留言儲存 [打印本頁]

作者: 小誌    時間: 2011-4-23 23:08     標題: 11-1-2 留言網頁與留言儲存

11-1-2   留言網頁與留言儲存
當我們要在網頁中提供一個可以讓網友發表意見或反映的留言板時,必須先設計一個『意見發表表單(addmsg.php)』,讓網友可以在上面發表意見,並且要能將這些意見資料送給我們處理留言資料的PHP程式『add.php』來記錄以及處理這些意見資料。
  現在請打開addmsg.php網頁,來了解一下如何製作一個可以讓網友在上面發表意見的表單:
[attach]5751[/attach]
圖11-5  addmsg.php網頁。

編號

欄位

欄位名稱

表單元件

留言主題

subject

單行文字方塊

您的大名

parent

單行文字方塊

E-Mail

email

單行文字方塊

代表圖形

pic

選擇鈕

留言性質

personal

下拉式功能表

留言內容

memo

多行文字方塊

送出意見

Submit

按鈕

清除重寫

按鈕



『留言主題』網頁敘述標籤
  1. <input type="text" name="subject" size="50" maxlength="20">
複製代碼
『您的大名』網頁敘述標籤
  1. <input type="text" name="parent" size="20" maxlength="20">
複製代碼
『E-Mail』網頁敘述標籤
  1. <input type="text" name="email" size="35" maxlength="40">
複製代碼
『代表圖形』網頁敘述標籤
  1. <input type="radio" name="pic" value="1" checked >
  2. <img src="1.gif">
  3. <input type="radio" name="pic" value="2"><img src="2.gif">
  4. <input type="radio" name="pic" value="3"><img src="3.gif">
  5. <input type="radio" name="pic" value="4"><img src="4.gif">
  6. <input type="radio" name="pic" value="5"><img src="5.gif">
  7. <input type="radio" name="pic" value="6"><img src="6.gif">
  8. <input type="radio" name="pic" value="7"><img src="7.gif">
  9. <input type="radio" name="pic" value="8"><img src="8.gif">
  10. <input type="radio" name="pic" value="9"><img src="9.gif">
  11. <input type="radio" name="pic" value="10"><img src="10.gif">
複製代碼
『留言性質』網頁敘述標籤
  1. <select name="personal" size="1">  
  2.   <option value="0" selected>大家來討論</option>
  3.   <option value="1">只給板主看</option>
  4. </select>
複製代碼
『留言內容』網頁敘述標籤
  1. <textarea name="memo" cols="50" rows="4" ></textarea>
複製代碼

作者: 小誌    時間: 2011-4-23 23:09

請特別注意:我們表單的名稱為『Addmsg』,而表單內容資料的傳送方式為『Post』,處理意見資料的PHP程式是『add.php』.
  1. <form name="addmsg" method="POST" action="add.php">
複製代碼
完整網頁內容列表如下:
addmsg.php
  1. <html>
  2. <head>
  3. <meta http-equiv="Content-Type" content="text/html; charset=big5">
  4. <title>麻辣家族留言板</title>
  5. </head>
  6. <body>
  7. <div align="center">
  8. <p align="center">
  9. <font size="2">
  10. <img src="title.gif">
  11. </font>
  12. <br>
  13. <font size="2"><a href="guest.php">
  14. <img border="0" src="team2.gif" align="absmiddle">
  15. 看看網友們的意見<img border="0" src="team2.gif" align="absmiddle">
  16. </a></font> </div>
  17. <form name="addmsg" method="POST" action="add.php">
  18. <div align="center">
  19. <table border="1" cellspacing="0" style="border-collapse: collapse"
  20. bordercolor="#FFFFFF" cellpadding="0">
  21. <tr><td bgcolor="#339933" align="center" valign="middle" width="147">
  22. <font color="#FFFFFF" size="2">留言主題</font></td>
  23. <td height="25" bgcolor="#E8FFE8"><font size="2">
  24. <input type="text" name="subject" size="50" value maxlength="20">
  25. </font></td></tr> <tr>
  26. <td bgcolor="#339933" align="center" valign="middle" width="147">
  27. <font color="#FFFFFF" size="2">您的大名</font></td>
  28. <td height="25" bgcolor="#E8FFE8"><font size="2">
  29. <input type="text" name="name" size="20" maxlength="20"></font></td>
  30. </tr>
  31. <tr>
  32. <td bgcolor="#339933" align="center" valign="middle" width="147">
  33. <font color="#FFFFFF" size="2">E-Mail</font></td>
  34. <td height="25" bgcolor="#E8FFE8"><font size="2">
  35. <input type="text" name="email" size="35" maxlength="40"></font></td>
  36. </tr>
  37. <tr>
  38. <td bgcolor="#339933" align="center" height="27" valign="middle" width="147">
  39. <font size="2" color="#FFFFFF">代表圖形</font></td>
  40. <td height="27" bgcolor="#E8FFE8">
  41. <font size="2">
  42. <input type="radio" name="pic" value="1" checked ><img src="1.gif">
  43. <input type="radio" name="pic" value="2"><img src="2.gif">
  44. <input type="radio" name="pic" value="3"><img src="3.gif">
  45. <input type="radio" name="pic" value="4"><img src="4.gif">
  46. <input type="radio" name="pic" value="5"><img src="5.gif">
  47. <input type="radio" name="pic" value="6"><img src="6.gif">
  48. <input type="radio" name="pic" value="7"><img src="7.gif">
  49. <input type="radio" name="pic" value="8"><img src="8.gif">
  50. <input type="radio" name="pic" value="9"><img src="9.gif">
  51. <input type="radio" name="pic" value="10"><img src="10.gif">
  52. </font>
  53. </td>
  54. </tr>
  55. <!--私人留言或公開-->
  56. <tr>
  57. <td bgcolor="#339933" align="center" width="147">
  58. <font color="#FFFFFF" size="2">留言性質</font></td>
  59. <td bgcolor="#E8FFE8">
  60. <font size="2">
  61. <select name="personal" size="1">
  62. <option value="0" selected>大家來討論</option>
  63. <option value="1">只給板主看</option>
  64. </select>
  65. </font>
  66. </td>
  67. </tr>
  68. <!--留言內容欄位-->
  69. <tr>
  70. <td bgcolor="#339933" align="Center" height="98" valign="middle" width="147">
  71. <font color="#FFFFFF" size="2">留言內容:</font>
  72. </td>
  73. <td height="98" valign="middle" bgcolor="#E8FFE8">
  74. <font size="2">
  75. <textarea name="memo" cols="50" rows="4" ></textarea>
  76. </font>
  77. </td></tr><tr><td align="Center" colspan="2">
  78. <font size="2"><input type="submit"value="送出意見">
  79. <input type="reset" value="重填資料"></font></td>
  80. </tr></table></div>
  81. </form></center>
  82. </body></html>
複製代碼

作者: 小誌    時間: 2011-4-23 23:11

留言處理程式
當網友在「意見發表表單」中填寫好相關資料,然後按下「送出意見」按鈕,表單中的資料內容就會以『POST』的方式由SEVER端讀取,因為我們在表單傳送的Action參數指定Server端處理此一表單資料內容的程式為『add.php』,因此我們就必須來撰寫能夠處理這些意見資料的PHP程式『add.php』。
在這個處理意見資料的PHP程式,我們可分為下列幾個部分:

1.接收來自『意見發表表單』中的各欄位資料
要將網友發言資料作後續處理及將這些資料內容存入資料庫之前,我們必須先把各個欄位的資料承接下來:
  1. //接收addmsg.php傳來的資訊
  2. $subject=$_REQUEST["subject"];
  3. $name = $_REQUEST["name"];
  4. $email = $_REQUEST["email"];
  5. $pic=$_REQUEST["pic"];
  6. $memo=nl2br($_REQUEST["memo"]);
  7. $personal = $_REQUEST["personal"];
複製代碼
其中比較特別的是留言內容「memo」的資料處理,留言內容欄位是多行文字輸入元件,當我們將輸入於多行文字輸入元件的資料顯示出來時,會有一個斷行的問題,輸入資料時,在多行文字輸入元件中按下「Enter」會有換行的效果,雖然在表面上看不到任何的換行字元,但實際上卻真實存在著一個換行字元「\r\n」,這個換行字元在我們輸出到瀏覽器時並不會有換行的效果,因此,輸出時應先使用「str_replace()」函數將這個換行字元「\r\n」替換成「<Br>」的HTML標籤符號。

2.建立chgStr函數
由於網友發言的資料必須以單引號括起來的的型式與Insert Into指令結合在一起,如果網友發言的資料內容原本就使用了單引號,將會使程式產生錯誤,因此我們就先自行建立一個chgStr函數,將網友發言的資料內容先經過chgStr函數過濾,若資料內容含有單引號則將單引號轉換為雙引號:
  1. //將單引號置換為雙引號
  2. Function chgStr($data)
  3. {
  4.    $chgStr = "'" . str_replace("'", "''", $data) . "'";
  5.    return $chgStr;
  6. }
複製代碼
3.建立與資料庫的連結
要將承接下來的各個欄位的資料寫入資料庫之前,必須先建立與資料庫的連結,mysql_connect()與mysql_select_db()函數的使用,之前我們已經談過不在贅言:
  1. //連結SQL Server
  2.     $conn = mysql_connect("127.0.0.1", "sa", "12345");
  3. //選擇資料庫
  4.     mysql_select_db("Message", $conn);
  5. //指定提取資料的校對字元表
  6.     mysql_query("set character set big5");
複製代碼

作者: 小誌    時間: 2011-4-23 23:14

4.建立新增資料錄的Insert Into指令
Insert Into指令敘述格式:
  1. Insert Into  資料表名  (欄位名) values (欄位值)
複製代碼
這種插入新資料錄的格式又可分為兩種形式:
逐一將欄位值設定給相對應的欄位,然後再新增至資料表中,例如:
[attach]5752[/attach]
另一種方式與上一種格式雷同,但是省略了欄位名稱:
[attach]5753[/attach]
建議儘量避免使用第二種方式,因為少了欄位對應很容易發生資料誤填的情況!

建立與資料庫的連結後,我們首先組合將新增資料錄的Instert Into指令,然後再寫入資料庫檔案中:
  1. //將資料寫入資料庫
  2. $sql = "Insert Into allmessage (網友姓名, 留言主題, 聯絡信箱, 留言內容, 私人公開, 圖形, 留言時間) Values (";
  3. $sql = $sql . chgStr($name) . ",";
  4. $sql = $sql . chgStr($subject) . ",";
  5. $sql = $sql . chgStr($email) . ",";
  6. $sql = $sql . chgStr($memo) . ",";
  7. $sql = $sql . chgStr($personal) . ",";
  8. $sql = $sql . $pic . ",'";
  9. $sql = $sql . date("Y-m-j H:i:s") . "')";
  10. mysql_query($sql);
複製代碼
5、轉向至顯示留言意見的網頁guest.php
    當網友發言的資料內容處理完畢並儲存至資料庫檔案中後,我們則必須將網頁轉向至顯示留言意見的網頁guest.php,如此一來,發言的網友就可看見他的發言是否已經順利的登錄:
  1. //將網頁轉向至顯示留言意見的網頁guest.php
  2. header("Location: guest.php");
複製代碼
add.php
  1. <?
  2. //接收addmsg.php傳來的資訊
  3. $subject=$_REQUEST["subject"];
  4. $name = $_REQUEST["name"];
  5. $email = $_REQUEST["email"];
  6. $pic=$_REQUEST["pic"];
  7. $memo=nl2br($_REQUEST["memo"]);
  8. $personal = $_REQUEST["personal"];

  9. //連結MySQL Server
  10.     $conn = mysql_connect("localhost", "root", "12345a");
  11. //選擇資料庫
  12.     mysql_select_db("Message", $conn);
  13. //指定提取資料的校對字元表
  14.     mysql_query("set character set big5");   

  15. //將單引號置換為雙引號
  16. Function chgStr($data)
  17. {
  18.    $chgStr = "'" . str_replace("'", "''", $data) . "'";
  19.    return $chgStr;
  20. }

  21. //將資料寫入資料庫
  22. $sql = "Insert Into allmessage (網友姓名, 留言主題, 聯絡信箱, 留言內容, 私人公開, 圖形, 留言時間) Values (";
  23. $sql = $sql . chgStr($name) . ",";
  24. $sql = $sql . chgStr($subject) . ",";
  25. $sql = $sql . chgStr($email) . ",";
  26. $sql = $sql . chgStr($memo) . ",";
  27. $sql = $sql . chgStr($personal) . ",";
  28. $sql = $sql . $pic . ",'";
  29. $sql = $sql . date("Y-m-j H:i:s") . "')";
  30. mysql_query($sql);

  31. //將網頁轉向至顯示留言意見的網頁guest.php
  32. header("Location: guest.php");
  33. ?>
複製代碼





歡迎光臨 麻辣家族討論版版 (http://forum.twbts.com/)