170 likes | 363 Views
電子商務網站架設. 表單. 表 單 form 標籤: <form> 成對標籤 功能:傳送資料到伺服器端的目標程式 格式: <form name=“ 表單名稱 ” action=“ 目標程式 url ” method=“ 傳送格式 ”> .. 各類子標籤 .. /form> name: 指定表單名稱 action: 處理 form 傳送過來的資料程式的相對或絕對位址 method: 傳送資料的方法 get: 使用字串傳送 缺點 : 無保密性
E N D
表單 • 表單form • 標籤:<form>成對標籤 • 功能:傳送資料到伺服器端的目標程式 • 格式: <form name=“表單名稱” action=“目標程式url” method=“傳送格式”> ..各類子標籤.. /form> name:指定表單名稱 action:處理form傳送過來的資料程式的相對或絕對位址 method:傳送資料的方法 get:使用字串傳送 缺點:無保密性 字串限制在512bytes內 post:使用封包傳送
Input 標籤 • <input>獨立標籤 • 功能 • 提供瀏覽者各類輸入介面及按鈕 • 位置 • 放在<form>標籤內 • 格式 • <input type=“元件名稱” name=“欄位名稱”value=“變數值” > • type • text(本文) • Password(密碼) • radio(單選) • checkbox(複選) • Submit(傳送鈕) • Reset(清除鈕)
Input 標籤(Cont.) • 範例 <HTML> <HEAD> <TITLE> 各種文字輸入型態測試</TITLE> </HEAD> <BODY> <form action=“test.php3" method="post"> 姓名: <input type="text" name="id" size=“12"><br> 密碼: <input type="password" name="passwd“ size=“14“ ><br> 職業: <input type="checkbox" name="student" value="on">學生 <input type="checkbox" name="officer" value="on">上班族<br>
Input 標籤(Cont.) • 範例(續) 年齡: <br> <input type="radio" name="age" value="0~10">10歲以下<br> <input type="radio" name="age" value="10~20">10~20歲<br> <input type="radio" name="age" value="20~30">20~30歲<br> <input type="radio" name="age" value="over30">30歲以上<br> <input type="hidden" name="flag" value="running"><br> <input type=“submit” value=“送出"> <input type=“reset” value=“重寫"> </form> </BODY> </HTML>
多重選項 Select …. Option(Cont.) • <selection>成對標籤 • <option>獨立標籤或成對標籤 • 語法 <select name=“元件名稱” size=“n” multiple=“multiple”> <option value=”變數值” selected> </option> <option value=”變數值” selected> </option> . . <option value=”變數值” selected> </option> </select>
多重選項 Select …. Option(Cont.) • 範例 <html> <body> <form> <select name="username1"> <option value="富豪">富豪</option> <option value="saab">Saab</option> <option value="mercedes">Mercedes</option> <option value="audi" selected>奧迪</option> </select> <select name="username2"> <option value="紅色">紅色</option> <option value="green">green</option> <option value="pink">pink</option> <option value="black">black</option> </select> <br> <input type="submit" value="送出"> <input type="reset" value="清除"> </form> </body> </html>
文字輸入 textarea • <textarea>成對標籤 • 語法 <textarea name=“欄位名稱” rows=“n” cols=“m”> …………….預設文字…………………… </textarea> name:欄位名稱 rows:設定列數 cols: 設定行數
文字輸入 textarea (Cont.) • 範例 html> <form> 姓名:<input type="text" name="name" size="10"><br/> 留言:<br/> <textarea name="message" rows="15" cols="30"> </textarea> <br/><input type="submit" value="送出留言"/> </form> </body> </html>
PHP簡介 • 是一種伺服器端支援的HTML嵌入式script語言 • 主要使用在動態網頁開發 • 可處理Web Server端的計算、文字、檔案…等 • 與資料庫連結能力 • 適合作為internet資料庫開發工具 • PHP的檔名 • 檔名.php • Ex • Test.php
PHP程式語言 • PHP程式碼的區域 • 程式區塊 • PHP程式區塊由PHP標籤所包覆 • PHP標籤格式 • <?php ?> • 例 <?php echo “我的第一個php程式” ?> • <? ?> • 例 <? echo “我的第一個php程式” ?>
PHP嵌入HTML的用法 • 範例 <html> <body> <?php echo “我的第一個php程式” ?> </body> </html>
HTML 與 PHP 的邂逅 • HTML程式碼 <html> <body> <form name="form1" method="post" action="postform.php?SUBJECT=ORDER"> 姓名:<input name="username" type="text"> <br> 車廠: <select name="username1"> <option value="富豪">富豪</option> <option value="saab">Saab</option> <option value="mercedes">Mercedes</option> <option value="audi" selected>奧迪</option> </select><br>
HTML 與 PHP 的邂逅(Cont.) • HTML程式碼(Cont.) 單價: <select name="cost"> <option value="1000000">1,000,000</option> <option value="200000o">2,000,000</option> </select> 數量:<input name="amount" type="text" size="4"><br> 顏色: <select name="color"> <option value="紅色">紅色</option> <option value="green">green</option> <option value="pink">pink</option> <option value="black">black</option> </select>
HTML 與 PHP 的邂逅(Cont.) • HTML程式碼(Cont.) <br> <input type="submit" value="送出"> <input type="reset" value="清除"> </form> </body> </html>
HTML 與 PHP 的邂逅(Cont.) • Php程式碼 <html> <body> <?php echo "hello!感謝您的購買,您訂購的明細如下:"; ?><br> 車子廠牌:<?php echo $_POST["username1"];?><br> 顏色:<?php echo $_POST["color"];?><br> <?php $cost=$_POST["cost"]; $amount=$_POST["amount"]; $total=$cost*$amount; ?> 數量:<?php echo $_POST["amount"];?><br> 總價:<?php echo $total;?>元
HTML 與 PHP 的邂逅(Cont.) • Php程式碼(Cont.) <?php $to="mychenp@gmail.com"; $subject="訂單"; $message="姓名:"; $message .=$_POST["name1"]; $message .="\r\n"; $message .=$_POST["username1"]; $message .="\r\n"; $message .=$_POST["color"]; $message .="\r\n"; $message .=$total; $message .="元"; mail($to,$subject,$message); ?> </body> </html>