Ch ng 5:ươ NH NG THÀNH PH N C A FORM: CHOỮ Ầ Ủ
PHÉP NG I DÙNG LÀM VI C V I D LI UƯỜ Ệ Ớ Ữ Ệ
Trong ng d ng Web, ng i s d ng nh p n i dung, nh n submit đ s lý. M t ti nứ ụ ườ ử ụ ậ ộ ấ ể ử ộ ế
trình thì không đ c hoàn thành b i l nh PHP, vì th mã l nh yêu c u ph i “thôngượ ở ệ ế ệ ầ ả
minh”.
HTML s g i đ n m t v trí đ c bi t và x lý vì khi b n đi n trông tin vào form,ẽ ở ế ộ ị ặ ệ ử ạ ề
đ bi t m t đ a ch email, mail,… b n c n m t ph ng ti n đ đ c n i dung.ể ế ộ ị ỉ ạ ầ ộ ươ ệ ể ọ ộ
Form trong HTML thì đ n gi n h n, nó ch v trí và cách th c g i nh th nào.ơ ả ơ ỉ ị ứ ử ư ế
T i đi m này PHP đ c ng d ng h n. T p l nh PHP nh n d li u t form và s d ngạ ể ượ ứ ụ ơ ậ ệ ậ ữ ệ ừ ử ụ
nó đ hoàn thành ho t đ ng, nh c p nh t nh ng n i dung c a c s d li u, g i m tể ạ ộ ư ậ ậ ữ ộ ủ ơ ở ữ ệ ử ộ
email, đ nh d ng d li u và h n th n a.ị ạ ữ ệ ơ ế ữ
PHP s d ng m t t p đ n gi n mà m nh, m t s k t h p, cung c p ph ng ti nử ụ ộ ậ ơ ả ạ ộ ự ế ợ ấ ươ ệ
đ làm m i th o khi chúng ta c n.ể ọ ứ ả ầ
Trong ch ng này b n b t đ u xây d ng m t ng d ng đ n gi n cho phép b nươ ạ ắ ầ ự ộ ứ ụ ơ ả ạ
thêm, b t, xóa thành ph n c a d li u. Chúng ta s đ c đ n v i PHP/MySQL nh : ớ ầ ủ ữ ệ ẽ ượ ế ớ ư
- T o nh ng form s d ng nút, h p so n th o và nh ng thành ph n khác.ạ ữ ử ụ ộ ạ ả ữ ầ
- T o t p l nh PHP đ x lý nh ng form HTML.ạ ậ ệ ể ử ữ
- Nh n d li u t hai bi n chính là: $_POST và $_GET.ậ ữ ệ ừ ế
- Qua thông tin n đ x lý t p l nh form v i nh ng đi u khi n form n và m tẩ ể ử ậ ệ ớ ữ ề ể ẩ ộ
chu i truy v n URL.ỗ ấ
5.1. Form đ u tiênầ
B t đ u là m t form đ n gi n ch có vùng so n th o và nút submit, t p l nh x lýắ ầ ộ ơ ả ỉ ạ ả ậ ệ ử
s hi n th giá tr nh p vào vùng so n th oẽ ể ị ị ậ ạ ả
Ví d : Trong bài t p này b n s đi n tên vào form. Đây là m t bi n đ n gi n trongụ ậ ạ ẽ ề ộ ế ơ ả
ch ng trình “Hello Word”. ươ
1/M trình so n th o nh p đo n mã sau và l u v i tên form1.htmlở ạ ả ậ ạ ư ớ
<html>
<head>
<title>Say My Name</title>
<style type="text/css">
- 102 -
?>
- 103 -
<pre>
DEBUG :
<?php
print_r($_POST);
?>
</pre>
</body>
</html>
3/M trình duy t v i file form1.html s cho k t qu nh ở ệ ớ ẽ ế ả ư Hình 5.1.1
Hình 5.1
Nh p vào khung ậ Name n i dung b t kỳ(ví d Test) và click nút Submitộ ấ ụ
b n s th y k t qu nh sau:ạ ẽ ấ ế ả ư
Hello Test
DEBUG :
Array
(
[Name] => Test
[SUBMIT] => Submit
)
Cách th c ho t đ ng :ứ ạ ộ
Đ hi u v cách th c ho t đ ng, chúng ta ph i tìm hi u v nh ng thành ph nể ể ề ứ ạ ộ ả ể ề ữ ầ
c a form và vài hàm PHP m i.ủ ớ
5.1.1. Thành ph n formầ
Thành ph n mà b n c n bi t tr c tiên là FORM. Nó gi i h n vùng formầ ạ ầ ế ướ ớ ạ
trong trang và t ch c nh ng vùng mà b n c n t trang web:ổ ứ ữ ạ ầ ừ
- 104 -
<form action=”formprocess1.php” method=”post”>
<!--form controls here-->
đ n. Nó s c p nh t n i dugn thông qua cú pháp:ơ ẽ ậ ậ ộ
<?php
echo $_POST[‘Name’]; // s hi n th m t ki u giá trẽ ể ị ộ ể ị
?>
• Ki u INPUT submit:ể
<input type=”submit” name=”SUBMIT” value=”Submit”>
Tên c a nó ph i g i ý khéo léo, ph n t submit hi n th b ng m t nút.ủ ả ợ ầ ử ể ị ằ ộ
Nút văn b n đ c đ t thông qua thu c tính giá tr . Nh ph ng pháp cho INPUTả ượ ặ ộ ị ư ươ
văn b n, đi u khi n form này c n có tên cho ti n trình chuy n đ n.ả ề ể ầ ế ể ế
5.1.3. X lý Formử
Trong l nh, chúng ta ph i chú ý đ n hàm và cú pháp m i đ tìm hi u vệ ả ế ớ ể ể ề
chúng
T p l nh x lý Form đ u tiên là m t bi n t ng tác c a “hello world” phậ ệ ử ầ ộ ế ươ ủ ổ
bi n, nh ng trong tr ng h p này nó hi n th “hello” và tên c a b n trong h p text.ế ư ườ ợ ể ị ủ ạ ộ
Đ đi u này x y ra, b n c n in giá tr c a tr ng văn b n mà b n đi n trong form.ể ề ả ạ ầ ị ủ ườ ả ạ ề
B n bi t l nh xu t, vì th chúng ta hãy di chuy n đ n m t b ph n,ạ ế ệ ấ ế ể ế ộ ộ ậ
$_POST[‘tên’].
M ng toàn c c $_POST ch a t t c các form d li u submit v i ph ng phápả ụ ứ ấ ả ữ ệ ớ ươ
POST. Danh m c m ng c a tr ng là tên c a nó. Trong th i đi m này b n s th yụ ả ủ ườ ủ ờ ể ạ ẽ ấ
cách ki m tra n i dung m ng $_POST s d ng hàm print_r() nh th nào.ể ộ ả ử ụ ư ế
<?php
echo “Hello “ . $_POST[‘Name’];
?>
- 106 -
Trong ví d này, $_POST[‘name’] hi n th cái gì b n nh p vào trong h pụ ể ị ạ ậ ộ
“Name.”Hello test”. đây print_r($_POST) k t xu t đ n gi n n i dung chung c aỞ ế ấ ơ ả ộ ủ
m ng toàn c c $_POST đ xu t ra. Đây là cách t t nh t đ biên d ch form. Nên sả ụ ể ấ ố ấ ể ị ử
d ng $_POST đ ki m tra, trình bày tr ng thài đ i t ng khi xây d ng t p l nh.ụ ể ể ạ ố ượ ự ậ ệ
Trong t p l nh formprocess1.php xu t ra m t vài th t ng t nh sau ậ ệ ấ ộ ứ ươ ự ư
Hello test
<title>Greetings Earthling</title>
<style type=”text/css”>
TD{color:#353535;font-family:verdana}
TH{color:#FFFFFF;font-family:verdana;background-color:#336699}
</style>
</head>
<body>
<form action=”formprocess2.php” method=”post”>
<table border=”0” cellspacing=”1” cellpadding=”3”
bgcolor=”#353535” align=”center”>
<tr>
<td bgcolor=”#FFFFFF” width=”50%”>Name</td>
<td bgcolor=”#FFFFFF” width=”50%”>
<input type=”text” name=”Name”>
</td>
</tr>
<tr>
<td bgcolor=”#FFFFFF”>Greetings</td>
<td bgcolor=”#FFFFFF”>
<select name=”Greeting”>
<option value=”Hello”>Hello</option>
<option value=”Hola”>Hola</option>
<option value=”Bonjour”>Bonjour</option>
</select>
</td>
- 108 -
</tr>
<tr>
<td bgcolor=”#FFFFFF” width=”50%”>Display Debug info</td>
<td bgcolor=”#FFFFFF” width=”50%”>
</pre>
<?php
}
?>
<p align=”center”><?php echo $_POST[‘Greeting’]; ?>
<?php echo $_POST[‘Name’]; ?></p>
</body>
</html>
4. L u formprocess2.php và t i nó lên th m c làm vi c c a b n.ư ả ư ụ ệ ủ ạ
5. G i trang trình duy t c a b n. B n có th th y k t qu nh ọ ệ ủ ạ ạ ể ấ ế ả ư hinh 5.2.1
Hình 5.2.1
6. nh p tên c a b n và n nút submit .K t qu nh ậ ủ ạ ấ ế ả ư hinh 5.2.2
Hình 5.2.2
Cách th c ho t đ ng:ứ ạ ộ
Nh b n th y đo n mã này, trình t gi ng nh trong ư ạ ấ ạ ự ố ư formprocess1.php. Hai
tr ng có thêm m t h p x xu ng và m t checkbox. formprocess2.php gi ng nhườ ộ ợ ổ ố ộ ố ư
formprocess1.php nh ng thêm m t h p cu n.Trình bày thông tin biên d ch ch khi h pư ộ ộ ộ ị ỉ ợ
ki m Debug đ c ch n và b n dùng b t kì ch n l a nào trong danh sách x xu ng .ể ượ ọ ạ ấ ọ ự ổ ố
- 110 -
5.2.1. Ki u nh p h p checkbox ể ậ ộ
Checkbox có th đ c trình bày hai v trí: Khi đ c ki m tra, nó thông qua giáể ượ ở ị ượ ể
tr trên m ng $_POST, nh ng m c khác nó không g i đi m i th . Đây là ph ng phápị ả ư ặ ử ọ ứ ươ
hay đ trình bày ki u d li u Boolean.ể ể ữ ệ
* SELECT element
<select name=”Greeting”>
<option value=”Hello”>Hello</option>
<option value=”Hola”>Hola</option>
<option value=”Bonjour”>Bonjour</option>
</select>
Ph n t SELECT cho phép b n trình bày m t danh sách ch n l a c đ nh mà ng iầ ử ạ ộ ọ ự ố ị ườ
<td bgcolor=”#FFFFFF” width=”50%”>Name</td>
<td bgcolor=”#FFFFFF” width=”50%”>
<input type=”text” name=”Name”>
</td>
</tr>
<tr>
<td bgcolor=”#FFFFFF”>What you are looking for</td>
<td bgcolor=”#FFFFFF”>
<select name=”MovieType”>
<option value=”” selected>Select a movie type...</option>
<option value=”Action”>Action</option>
<option value=”Drama”>Drama</option>
<option value=”Comedy”>Comedy</option>
<option value=”Sci-Fi”>Sci-Fi</option>
<option value=”War”>War</option>
<option value=”Other”>Other...</option>
</select>
</td>
</tr>
<tr>
<td bgcolor=”#FFFFFF”>Add what?</td>
- 112 -
<td bgcolor=”#FFFFFF”>
<input type=”radio” name=”type” value=”Movie” checked>
Movie<br>
<input type=”radio” name=”type” value=”Actor”>
Actor<br>
<input type=”radio” name=”type” value=”Director”>
Director<br>
</td>