Board logo

標題: [教學] (PHP+IIS+MsSQL教學第17篇) 表單欄位資料使用 上篇 [打印本頁]

作者: 小誌    時間: 2010-5-14 18:08     標題: (PHP+IIS+MsSQL教學第17篇) 表單欄位資料使用 上篇

表單欄位資料的使用
在上一篇教學中,我們僅就表單的資料傳遞方式加以說明,範例中的表單元件「單行文字輸入元件(Text)」與「多行文字輸入元件(Textarea)」並沒有加以說明,事實上,表單的元件相當的多,而表單與表單元件在我們PHP中利用到的機會非常的多,所以有必要下點功夫對表單元件多熟悉一點,在說明這些元件的同時,筆者將會就這些元件欄位相關的PHP函數與物件方法加以介紹。


單行文字輸入元件(Text)
單行文字輸入元件是表單中的基礎元件,出現機率百分之九十以上,例如姓名、住址、電話..等等資料的輸入都會用到它:
  1. 欄位說明文字:<Input Type=”Text” Name=”識別名”>
複製代碼
例如:
  1. 地址:<Input Type=”Text” Name=”Address”>
複製代碼
若您要限制可輸入的字數可加上「Maxlength」屬性,若資料是要寫入資料庫,這個字數限制是有必要限定的,避免使用者故意輸入大量的文字,造成資料庫欄位長度不足,例如限制最大輸入字數為50個字:
  1. 地址:<Input Type=”Text” Name=”Address” Maxlength=”50”>
複製代碼
另外,「Size」屬性可設定單行文字輸入元件的顯示寬度;「Value」屬性可設定出現在單行文字輸入元件中的預設值,例如:
  1. 地址:<Input Type=”Text” Name=”Address” Value=“請輸入戶籍地址”>
複製代碼
在PHP中有些函數是與文字輸入的資料處理有密切的關係,例如使用者故意加入HTML標籤,造成資料在顯示時出現不正常排列,造成頁面排版格式亂掉,此種狀況最常出現的就是在「留言版」或「討論區」,此時就可使用「htmlspecialchars()」函數來處理:
htmlspecialchars ()函數格式
  1. string htmlspecialchars ( string string [, int quote_style [, string charset]])
複製代碼
  1. <html><head>
  2. <title>單行文字輸入元件使用</title>
  3. </head><body>
  4. <form action="text_ans.php" method="Post">
  5. 地址:
  6. <input type="Text" name="Address">
  7. <input type="Submit">
  8. </form>
  9. </body></html>
複製代碼
[attach]412[/attach]
  1. <html><head>
  2. <title>單行文字輸入元件使用</title>
  3. </head><body>
  4. <?
  5. $myaddress=$_REQUEST["Address"];
  6. ?>
  7. 關閉HTML標籤使用:<?=htmlspecialchars($myaddress)?>
  8. <P>
  9. 開放HTML標籤使用:<?=$myaddress?>
  10. </body></html>
複製代碼
利用「htmlspecialchars」方法可將欄位內的資料加以編碼,結果就成為「&lt;B&gt;台北縣&lt;/B&gt;」,瀏覽器遇到這種特殊字元就會加以解碼成文字顯示出來,而不會將其當成HTML標籤來解讀。
[attach]413[/attach]

若要計算使用者所輸入的資料長度(字元數),可使用「strlen函數,如果是空字串則長度為0,特別要注意:空白字元也佔用一個字元長度。
為了確保資料的輸入正確性,避免空白字元的誤輸入與計算資料長度的正確性,我們可以利用「trim()」函數移除資料字串左右兩邊的空白字元,但是夾雜於字元與字元間的空白字元並不會被消除。
  1. <form action="text_ans_2.php" method="Post">
  2. 地址:
  3. <input type="Text" name="Address">
  4. <input type="Submit">
  5. </form>
複製代碼
例如:故意於資料前方加入三個空白字元,資料中間與後方各加入一個空白字元:
[attach]414[/attach]
  1. <html><head>
  2. <title>單行文字輸入元件使用</title>
  3. </head><body>
  4. <?
  5. $myaddress=$_REQUEST["Address"];
  6. ?>
  7. 原始資料:<?=$myaddress?><Br>
  8. 長度:<?=strlen($myaddress)?><Br>
  9. <P>
  10. 去兩邊空白資料:<?=trim($myaddress)?><Br>
  11. 長度:<?=strlen(trim($myaddress))?><Br>
  12. <P>
  13. </body></html>
複製代碼
在下圖中,利用「trim()」等函數移除資料字串左右兩邊的空白字元,再利用「strlen()」函數計算資料長度,您可以發現夾雜於字元與字元間的空白字元並不會被消除,而且一個空白字元就佔用一個空間長度,注意:一個中文字算兩個字元長度。
[attach]416[/attach]



密碼欄位元件(Password)
密碼欄位元件(Password)外觀上與單行文字輸入元件一模一樣,但在密碼欄位元件中輸入的資料會以「*」星號顯示:
  1. 欄位說明文字:<Input Type=”Password” Name=”識別名”>
複製代碼
例如:
  1. 密碼:<Input Type=”Password” Name=”paswd”>
複製代碼
另外,密碼欄位元件與單行文字輸入元件一樣,透過「Size」屬性可設定顯示的寬度;「Value」屬性可設定出現在元件中的預設值,不過,應該沒有人會為密碼欄位元件建立預設值吧!


      提示!!
密碼欄位元件在資料輸入時會以星號取代所輸入的文字,但在伺服端讀取的資料依然是使用者所輸入的原始資料,同樣地,若表單使用「Get」的方式傳遞表單資料,使用者所輸入的原始資料也會附在網址後方而顯示在瀏覽器的網址列中,所以,當表單中含有密碼欄位元件時,表單資料的傳遞方式應採用「Post」。
作者: 小誌    時間: 2010-5-14 18:15

多行文字輸入元件(Textarea)
如果輸入的資料量不多,那麼單行文字輸入元件是最適合的元件,但是,在需要大量輸入資料的場合就應該使用多行文字輸入元件(Textarea)比較適合:
  1. <textarea name=”識別名” cols=”欄數” rows=”列數”></textarea>
複製代碼
多行文字輸入元件利用「cols」屬性來設定顯示的寬度(字數),因為它可以輸入多行文字,所以又有「rows」屬性來設定顯示的高度(行數),因為多行文字輸入元件可輸入的資料量比較大,當表單中含有多行文字輸入元件時,表單資料的傳遞方式應採用「Post」,以避免傳送的資料被截斷。


為避免輸入的資料中含有HTML標籤而造成困擾,多行文字輸入元件也多會配合「htmlspecialchars()」函數來處理。
  1. <html><head>
  2. <title>多行文字輸入元件使用</title>
  3. </head><body>
  4. <form action="textarea_ans.php" method="Post">
  5. 請輸入留言:<Br>
  6. <Textarea name="content" cols="35" rows="5">
  7. </Textarea><Br>
  8. <input type="Submit">
  9. </form>
  10. </body></html>
複製代碼
另外,當我們將輸入於多行文字輸入元件的資料顯示出來時,會有一個斷行的問題,輸入資料時,在多行文字輸入元件中按下「Enter」會有換行的效果,雖然在表面上看不到任何的換行字元,但實際上卻真實存在著一個換行字元,這個換行字元在我們輸出到瀏覽器時並不會有換行的效果,因此,輸出時應先使用「nl2br()」函數將這個換行字元替換成「<Br>」的HTML標籤符號。
nl2br ()函數格式
  1. string nl2br ( string string)
複製代碼
[attach]417[/attach]
  1. <html><head>
  2. <title>多行文字輸入元件使用</title>
  3. </head><body>
  4. <?
  5. $mycontent=$_REQUEST["content"];
  6. ?>
  7. 原始資料(未置換):<Br>
  8. <?=$mycontent?>
  9. <P>
  10. 原始資料(已置換):<Br>
  11. <?=nl2br($mycontent)?>
  12. </body></html>
複製代碼
[attach]418[/attach]


有時候,我們的輸入版面與資料輸入版面的配置不同,如果依原始資料格式來輸出,可能造成我們網頁排版的問題,因此,亦可以使用「wordwrap()」函數來指定每一行資料的輸出長度:
wordwrap()函數格式
  1. string wordwrap ( string str [, int width [, string break [, boolean cut]]])
複製代碼
[attach]419[/attach]
文字折行。
  1. <html><head>
  2. <title>多行文字輸入元件使用</title>
  3. </head><body>
  4. <?
  5. $mycontent=$_REQUEST["content"];
  6. ?>
  7. 原始資料(未換行):<Br>
  8. <?=$mycontent?>
  9. <P>
  10. 原始資料(已換行):<Br>
  11. <?
  12. $newword=wordwrap($mycontent,40,"<br>",1);
  13. echo "$newword";
  14. ?>
  15. </body></html>
複製代碼
我們常在留言板或討論區中見到有些網友很喜歡罵髒話,要解決出現不雅字句的辦法,就是將髒話過濾掉,把它換成文字或乾脆消除它,若要置換掉字串中的某些字句可使用「str_replace()」函數:
str_replace()函數格式
  1. mixed str_replace ( mixed search, mixed replace, mixed subject [, int &count])
複製代碼
例如:
  1. <?
  2. $testword="你真是個壞蛋";
  3. $newword=str_replace("壞蛋","bad man",$testword);
  4. echo $newword; //輸出'你真是個bad man'
  5. ?>
複製代碼

作者: 小誌    時間: 2010-5-14 18:18

單選按鈕(Radio)
單選按鈕(Radio)適用於多備選案答案且單一答案選取的場合,如同單選的選擇題,例如血型、性別…等:
  1. <input type=”Radio” name=”識別名” value=”資料值”>
複製代碼
由於使用者只需點選答案,不需要填寫資料,所以我們必須為每一個單選按鈕建立不同的資料值,最重要的是:為了讓多個單選按鈕成為單選的群組,故同群組內的單選按鈕其「name」屬性值必須為相同的「識別名」。
  1. <html><head>
  2. <title>單選按鈕元件使用</title>
  3. </head><body>
  4. <form action="radio_ans.php" method="Post">
  5. 請選擇血型:<Br>
  6. <Input type="Radio" name="blood" value="A" Checked>A
  7. <Input type="Radio" name="blood" value="B">B
  8. <Input type="Radio" name="blood" value="O">O
  9. <Input type="Radio" name="blood" value="AB">AB
  10. <Br>
  11. <input type="Submit">
  12. </form>
  13. </body></html>
複製代碼
若我們要將某個單選按鈕預設為已選取,則可加入「Checked」屬性設定,例如將血型A的項目設為預先選取「<Input type="Radio" name="blood" value="A" Checked>」,當網頁一開啟後,「A」這個單選按鈕即為選取狀態。
[attach]421[/attach]
當使用者選取了某個單選按鈕後,那麼選取項目的切換僅限於同全中的其他單選按鈕,沒有辦法取消而不選取群組中的任何單選按鈕。




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