Thẻ <form> được sử dụng
để tạo các biểu mẫu, cho phép người dùng nhập dữ liệu và gửi về server.
Cú pháp:
Cú pháp sử dụng thẻ form khá
đơn giản, bao gồm một thẻ mở và một thẻ đóng. Bên trong thẻ form chứa các điều
khiển (control) của biểu mẫu (chẳng hạn như text, button, radio button,
checkbox...).
Ví dụ: <form>
First
name:<br>
<input type="text" name="firstname" value="Mickey">
<br>
Last
name:<br>
<input type="text" name="lastname" value="Mouse">
<br><br>
<input type="submit" value="Submit">
</form>
Thuộc tính action
Thuộc tính action quy
định nơi dữ liệu được gửi đến. Địa chỉ này có thể là trên cùng server với trang
web hiện tại hoặc trên bất kỳ server nào khác.
Chẳng hạn, biểu mẫu dưới đây
gửi dữ liệu lên một địa chỉ trên Server của Google:
<form action="https://www.google.com.vn/">
<input type="text" name="q"/>
<input type="submit" value="Tìm kiếm"/>
</form>
Thuộc tính method
Thuộc tính method quy
định cách thức dữ liệu được gửi lên server. Có 2 cách thức thường được sử dụng
đó là POST và GET.
Hoặc:
Phân biệt POST và GET
Phương thức được sử dụng mặc
định (tức là khi chúng ta không quy định thuộc tính method) là GET.
Sự khác biệt cơ bản giữa 2 chế
độ này là:
GET
|
POST
|
Dữ liệu được gửi đi sẽ hiển thị
trên thanh địa chỉ của trình duyệt
|
Dữ liệu được gửi đi không hiển thị
trên thanh địa chỉ của trình duyệt
|
Không nên sử dụng để gửi các dữ
liệu nhạy cảm (chẳng hạn như mật khẩu)
|
Được sử dụng để gửi các dữ liệu
nhạy cảm
|
Thường được sử dụng để gửi những
dữ liệu nhỏ
|
Không hạn chế dung lượng dữ liệu
gửi đi. Thường được sử dụng để gửi dữ liệu lớn lên server.
|
Đặt tên cho các trường
Lưu ý rất quan trọng: Cần phải
đặt tên cho các trường của biểu mẫu. Nếu một trường nào đó không được đặt tên
thì dữ liệu của trường đó sẽ bị bỏ qua (không được gửi lên server).
Chẳng hạn, trong ví dụ sau thì
chỉ có dữ liệu của trường "Last name" được gửi đi:
<form action="/action_page.php">
First name:<br>
<input type="text" value="Mickey"><br>
Last name:<br>
<input type="text" name="lastname" value="Mouse"><br><br>
<input type="submit" value="Submit">
</form>
Nhóm các dữ liệu của biểu mẫu lại với nhau
Chúng ta có thể sử dụng thẻ
<fieldset> và thẻ <legend> để nhóm các dữ liệu của biểu mẫu lại với
nhau.
Cú pháp sử dụng tương tự như
sau:
<form action="/action_page.php">
<fieldset>
<legend>Personal information:</legend>
First name:<br>
<input type="text" name="firstname" value="Mickey"><br>
Last name:<br>
<input type="text" name="lastname" value="Mouse"><br><br>
<input type="submit" value="Submit">
</fieldset>
</form>
Đăng nhận xét