1、網頁設計實務-PHP 與資料庫整合,本週的主題,網頁互動的開始-HTML表單復習PHP在電腦中都裝些什麼-資料的種類與型態要想記住事情，就得有腦細胞-變數(儲存資料的空間)與運算式,HTML表單,互動式的網頁就必須製作一個使用者介面讓使用者可以做輸入資料的動作,使用者, 填寫表單, 回應表單,伺服器, 讀取表單,簡單的HTML表單例,HTML原始碼,表單概念,表單標籤主要有兩個作用提供各種輸入資料的形式能讓使用者通知WWW瀏覽器已經完成輸入了表單處理表單將使用者輸入的內容傳給指定的處理程式進行處理此程式是在網頁伺服器端稱為CGI（Common Gateway Interface）程式,表單標籤
2、,FORM標籤構成表單主體的標籤，以形式開頭與結束，其它表單相關的標籤都必須包含在其中FORM標籤有兩個屬性：ACTION：在網頁伺服器端接收表單資料進行後續處理的CGI程式之位置METHOD：選擇表單資料的傳送方法，有GET與POST兩種在HTML標籤中雖然沒有規定屬性值一定要以（雙引號）括起來，但仍建議養成此習慣,表單標籤,INPUT標籤用以輸入資料，可以用來在網頁中設定欄位讓使用者將資料輸入主要屬性有NAME，代表輸入資料的欄位名稱TYPE代表資料輸入的形式VALUE則代表此欄位的值依TYPE屬性的不同，附帶的其它屬性亦不一樣,INPUT標籤屬性,文字輸入框：TYPE=TEXT。例如，I
3、NPUT TYPE=TEXT SIZE=8 NAME=Name其中SIZE屬性是用以指定顯示在WWW瀏覽器上文字框長度可用MAXLENGTH屬性限制輸入資料的最大長度VALUE屬性則是設定此文字欄位的預設值,INPUT標籤屬性,密碼欄：TYPE=PASSWORD。例如，INPUT TYPE=PASSWORD SIZE=8 NAME=Password和文字輸入框一樣具有VALUE、MAXLENGTH、SIZE等屬性不過密碼欄設定預設值是很奇怪的事密碼欄的特色為使用者輸入資料到此欄位中時，其內容會自動隱藏起來，以防止輸入的密碼遭偷看到、外洩,INPUT標籤屬性,單選鈕：TYPE=RADIO。例如，
4、INPUT TYPE=RADIO NAME=Sex VALUE=男 CHECKED男INPUT TYPE=RADIO NAME=Sex VALUE=女女TYPE為RADIO的標籤往往多個一起出現且其NAME屬性具有相同的值以上例而言，即為二選一，選項是以小圓圈的形式出現CHECKED字樣只能出現在其中一個選項中，代表此欄位的預選值,INPUT標籤屬性,核取方塊：TYPE=CHECKBOX。例如，INPUT TYPE=CHECKBOX NAME=Like VALUE=香蕉香蕉INPUT TYPE=CHECKBOX NAME=Like VALUE=鳳梨鳳梨INPUT TYPE=CHECKBOX N
5、AME=Like VALUE=芒果芒果和單選鈕類似，也可以多個一起出現其NAME屬性具有相同的值可以多選，選項以核取方塊形式出現，被選取後會在方塊內打勾CHECKED也可以用於核取方塊中且不限定只能出現在一個選項中,example-2.htm,example-2.htm原始碼,INPUT標籤屬性,提交按鈕：TYPE=SUBMIT。例如，INPUT TYPE=SUBMIT VALUE=完成這是一個按鈕，按下代表送出表單並啟動ACTION屬性指定的CGI程式處理之VALUE屬性的值可以改變按鈕上的文字描述它可以不需指定NAME屬性,INPUT標籤屬性,重置按鈕：TYPE=RESET。例如，INPU
6、T TYPE=RESET VALUE=取消這也是一個按鈕按下代表清除表單中各欄位的內容，回復到預設的初始狀態,Select標籤,SELECT標籤，用以產生下拉式選單來輸入資料。其形式如下：SELECT NAME=Like OPTION VALUE=香蕉香蕉/OPTION OPTION VALUE=鳳梨 SELECTED鳳梨/OPTION OPTION VALUE=芒果芒果/OPTION/SELECT,Select標籤,SELECT標籤中包含有若干個OPTION標籤，每一項OPTION代表一個選項VALUE屬性為選項被選定時的傳回值，被OPTION起始與結束標籤則是呈現在WWW瀏覽器中的選項內容
7、SELECTED代表預設值為選取該選項SIZE屬性可以設定下拉選單的高度,Select標籤,SELECT標籤亦可應用於多選，於SELECT中加上MULTIPLE即可。如：SELECT MULTIPLE NAME=Like在多選的情況下，使用者可以在點選時同時按下鍵盤的鍵即可達到多選的目的,TEXTAREA標籤,用以產生文字區塊以應用於需輸入大量文字資料的時候和TEXT標籤不同的是，TEXT標籤適用於少量的文字、可以一行輸入完畢，TEXTAREA標籤則常用於討論區、留言板中的內容輸入。其格式如下： TEXTAREA NAME=Comment ROWS=3 COLS=20 在此輸入內容 /TEXT
8、AREA其中ROWS屬性為文字區塊的高度、COLS屬性為文字區塊的寬度,問題,example-1.htm中action對應的cgi程式為?method使用的是?方法比較input標籤中size和maxlength的不同?radio與checkbox的差別?example-3.htm與example-3a.htm的差別在哪裡,表單資料驗證,前端的表單資料驗證表單的內容一經傳送到網頁伺服器端後即交由指定的CGI程式進行後續的處理然而在WWW瀏覽器端可以先使用WWW瀏覽器可執行的描述語言如Javascript進行前端檢查作業，看看表單所輸入的資料是否有錯誤,前端的表單資料驗證優點,協助使用者快速找出
9、錯誤：在輸入資料的過程常因不小心而打錯、或漏打，利用前端表單資料驗證作業可在送出表單資料給網頁伺服器前發現問題，減少使用者不必要的等候。強化網站的資訊安全：簡單防範SQL Injection,前端的表單資料驗證優點,降低網頁伺服器的負擔：錯誤的表單輸入可能使CGI程式產生沒有用的結果，浪費網頁伺服器執行效能，在前端表單資料驗證時檢查出錯誤可避免這種情形的發生減少不必要的網路傳輸：網路頻寬是寶貴的資源，前端表單資料驗證可減少不當的網路資料傳輸,前端表單主要資料驗證項目,欄位是否已經填寫資料，例如：密碼欄不應為空白。欄位所填的資料是否符合應有之格式與值域，例如年齡欄應填入小於100之整數。避免無心
10、的錯誤：部分資料如學號、身分證號，多具有檢查碼的設計，可用於檢驗所輸入之學號是否合理,範例,看看著名網站的表單資料驗證,雅虎奇摩會員註冊http:/ point numbers）字串型態（Strings）陣列型態（Arrays）物件型態（Objects）資源型態（Resources）空值型態（NULL）,布林型態（Booleans）,最簡單的一種資料型態，其值只有True（真）與False（假）兩種。主要使用於邏輯運算中應用表單中， 婚姻狀態欄位(已婚/未婚)條件判斷式的結果亦為布林型態，如 if (成績=60) echo 及格; else echo 不及格; ,整數型態（Integers）,
11、PHP表示整數的方式可以用十進制、十六進制與八進制，正負號標示於數值的前面十進制：直接以數值表示，例如100。十六進制：數值以0x開頭，例如0x100，等於十進制的256。八進制：數值以0（阿拉伯數字的零，不是英文字母的O）開頭，例如0100，等於十進制的64,想想以下程式的輸出結果,PHP 的整數; echo 0x100; echo ; echo 0100;?,ex2.php,你答對了嗎？,浮點數型態（Floating point numbers）,含有小數的數值，可以用下列的方式來表示，其中e可使用大寫也可以使用小寫。,字串型態（Strings）,由一連串字元所構成，每一個字元為1 Byt
12、e在PHP中並無字串長度的限制表示一個字串可以把一連串的字元以一對單引號或一對雙引號將內容前後括起來，但是其作用略有不同雙引號內的變數（變數以$開頭，用以儲存資料，將於稍後介紹）可被顯示成其內容而單引號則會把它當作是一個普通的文字處理,ex3.php,PHP 的字串; echo 我的名字叫做$myname ;?,結果你又答對了嗎？,問題來了,如果字串內有單引號或雙引號時要怎麼辦？特殊字元如換行要怎麼表示？如空中大學要以 echo 輸出echo 空中大學,特殊字元,陣列型態（Arrays）,當同一性質的變數需要很多個時可以使用陣列來簡化它的處理,PHP 的陣列;$age = array(Mary
13、=18, Tom=21, Jim=25);echo 我的年紀是$ageTom歲;?,ex4.php,想想結果、想想如何應用,進一步的利用,example-3a.php,請問您想知道誰的年紀?郭秋田呂秀霞蔡玉鈴 ,example-3a.php,25, 玉鈴=18, 秀霞=20); if (array_key_exists(Name,$_POST) $n = $_POSTName; $a = $age$n; echo $n 的年紀是 $a 歲 ; ?,物件型態（Objects）,PHP提供物件的功能，使用者可以利用物件定義出較為複雜或是符合應用需求的資料型態一個新的資料型態稱為類別在類別中可定義它
14、的成員與函數用以代表物件的屬性與操作方式使用物件的程序有兩部分首先先完成類別的定義、宣告接著使用new來產生實際的物件,定義類別的語法,class 類別名稱 var 資料成員; function 成員函數() 函數內容; ,ex5.php,status=$new_status; echo 將燈號設定為 . $this-status . 燈; / 定義顯示目前狀態成員函數 function get_signal() echo 現在是 . $this-status . 燈; ,ex5.php,PHP 的物件$s = new signal();$s-set_signal(紅);$s-get_sign
15、al();?,執行結果,資源型態（Resources）,這是一種特別的型態，在PHP中資源型態變數用以連接外部的資源例如：一個資料庫連線資源型態變數必須使用特殊的函數來操作,空值型態（NULL）,空值型態只有一個值那就是NULL代表變數沒有值如$var=NULL;is_null()函數可用於檢查變數的值是否為NULL$var= ;並不是空值，它代表$var的內容是一個空白字元,自我評估,我了解每一種資料型態了我會表達十進位、八進位與十六進位整數陣列型態懂了嗎？(很難的耶)物件的用途與使用時機?(難如上青天)我是否看到複雜的程式不會害怕我是否看到複雜的程式不會頭昏眼花到目前為止我的精神還很好，沒
16、有想睡覺 cc.,變數,變數是程式中用以儲存資料的一種方式它除了可以儲存程式執行過程所需的資料外也可以進行運算、輸出在學習任何一種程式語言的過程中，了解變數的各項運作方式相當的重要,命名,在PHP中變數的名稱前必需加上一個$例如：$name、$var、$i等皆代表一個變數，變數有大小寫的區別。PHP的變數名稱和其他標籤的命名規則相同，一個有效的變數名稱是由英文字母或底線開始，跟著是任意長短的字母、數字或底線,預設變數,PHP中有些變數是預先定義好的，可以直接使用，這些變數通常有特別的用途在為一般的變數命名時，請不要使用這些變數名稱預設變數通常為大寫預設變數種類$_SERVER$_GET$_PO
17、ST$_SESSION $_COOKIE,$_SERVER變數,SERVER_NAME：網頁伺服器的名稱。SERVER_SOFTWARE：網頁伺服器使用的軟體。SERVER_PROTOCOL：網頁伺服器使用的協定。DOCUMENT_ROOT：網頁伺服器的網頁文件主目錄。HTTP_USER_AGENT：使用者WWW瀏覽器的版本。REMOTE_ADDR：使用者的連線IP位址。,ex6.php,PHP 的預設變數 伺服器軟體: . $_SERVERSERVER_SOFTWARE;echo 伺服器使用的協定: . $_SERVERSERVER_PROTOCOL;echo 伺服器的網頁文件主目錄: .
18、$_SERVERDOCUMENT_ROOT;echo 使用者WWW瀏覽器的版本: . $_SERVERHTTP_USER_AGENT;echo 使用者的連線IP位址: . $_SERVERREMOTE_ADDR;?,預設變數,$_GET：使用HTTP GET方式傳回的變數，即可以用來接收、處理以GET方式傳回的使用者所填表單資料。$_POST：使用HTTP POST方式傳回的變數，即可以用來接收、處理以POST方式傳回的使用者所填表單資料$_SESSION：讀取已註冊的SESSION變數$_COOKIE：讀取WWW瀏覽器的cookie內容,運算式,PHP提供的運算常用的有指定運算算術運算字串運
19、算邏輯運算比較運算,指定運算,即利用=（等號）把右邊的運算結果，存入左邊的變數在等號的左邊只能是一個變數符號，如$x=$x+6以數學的眼光來看，這是一個不會成立的式子在程式中則代表把原$x的值加上6後再存入$x中,算術運算,字串運算,功能為連接兩個字串使用的運算子符號為.例如$a = $b . $c表示$a的內容為$b與$c字串連接,邏輯運算,比較運算,自我評估,我了解變數的概念了嗎？我知道PHP有哪些預設變數，並知道它們的功能我會寫一個PHP程式把預設變數的內容顯示出來我已經能看得懂各種不同的運算式，並知道如何解釋它,作業,在example-1a.htm、check.php中教了如何以$_POST陣列讀取表單的填入值請製作一個表單，讓使用者輸入姓名、性別、通關密語等欄位如果使用者為男性則稱呼其為先生、否則為小姐如果通關密語正確，顯示歡迎光臨否則顯示登入失敗請存檔在public_html/ex6.php,作業,提示,可以用frontpage或記事本繪製表單if指令與用法可參考example-1a.htm、check.php 或 example-3a.php,
