Thuộc tính biểu mẫu HTML
Chương này mô tả các thuộc tính khác nhau cho <form>phần tử HTML.
Thuộc tính hành động
Thuộc actiontính xác định hành động sẽ được thực hiện khi biểu mẫu được gửi.
Thông thường, dữ liệu biểu mẫu được gửi đến tệp trên máy chủ khi người dùng nhấp vào nút gửi.
Trong ví dụ dưới đây, dữ liệu biểu mẫu được gửi đến một tệp có tên "action_page.php". Tệp này chứa tập lệnh phía máy chủ xử lý dữ liệu biểu mẫu:
Thí dụ
Khi gửi, hãy gửi dữ liệu biểu mẫu tới "action_page.php":
<form action="/action_page.php">
<label for="fname">First
name:</label><br>
<input type="text" id="fname" name="fname"
value="John"><br>
<label for="lname">Last name:</label><br>
<input type="text" id="lname" name="lname" value="Doe"><br><br>
<input type="submit" value="Submit">
</form>
Mẹo: Nếu actionthuộc tính bị bỏ qua, hành động được đặt thành trang hiện tại.
Thuộc tính mục tiêu
Thuộc targettính chỉ định nơi hiển thị phản hồi nhận được sau khi gửi biểu mẫu.
Thuộc targettính có thể có một trong các giá trị sau:
| Value | Description |
|---|---|
| _blank | The response is displayed in a new window or tab |
| _self | The response is displayed in the current window |
| _parent | The response is displayed in the parent frame |
| _top | The response is displayed in the full body of the window |
| framename | The response is displayed in a named iframe |
Giá trị mặc định _selfcó nghĩa là phản hồi sẽ mở trong cửa sổ hiện tại.
Thí dụ
Tại đây, kết quả đã gửi sẽ mở ra trong một tab trình duyệt mới:
<form action="/action_page.php" target="_blank">
Thuộc tính phương pháp
Thuộc methodtính chỉ định phương thức HTTP sẽ được sử dụng khi gửi dữ liệu biểu mẫu.
Dữ liệu biểu mẫu có thể được gửi dưới dạng biến URL (với method="get") hoặc dưới dạng giao dịch bài đăng HTTP (với method="post").
Phương thức HTTP mặc định khi gửi dữ liệu biểu mẫu là GET.
Thí dụ
Ví dụ này sử dụng phương thức GET khi gửi dữ liệu biểu mẫu:
<form action="/action_page.php" method="get">
Thí dụ
Ví dụ này sử dụng phương thức POST khi gửi dữ liệu biểu mẫu:
<form action="/action_page.php" method="post">
Lưu ý về GET:
- Thêm dữ liệu biểu mẫu vào URL, trong các cặp tên / giá trị
- KHÔNG BAO GIỜ sử dụng GET để gửi dữ liệu nhạy cảm! (dữ liệu biểu mẫu đã gửi hiển thị trong URL!)
- Độ dài của một URL bị giới hạn (2048 ký tự)
- Hữu ích cho việc gửi biểu mẫu trong đó người dùng muốn đánh dấu kết quả
- GET tốt cho dữ liệu không an toàn, chẳng hạn như chuỗi truy vấn trong Google
Ghi chú về BÀI ĐĂNG:
- Thêm dữ liệu biểu mẫu bên trong nội dung của yêu cầu HTTP (dữ liệu biểu mẫu đã gửi không được hiển thị trong URL)
- POST không có giới hạn về kích thước và có thể được sử dụng để gửi một lượng lớn dữ liệu.
- Không thể đánh dấu các bài gửi biểu mẫu bằng POST
Mẹo: Luôn sử dụng POST nếu dữ liệu biểu mẫu chứa thông tin nhạy cảm hoặc thông tin cá nhân!
Thuộc tính tự động hoàn thành
Thuộc autocompletetính chỉ định xem biểu mẫu có nên bật hay tắt tính năng tự động hoàn thành hay không.
Khi bật tính năng tự động hoàn thành, trình duyệt sẽ tự động hoàn thành các giá trị dựa trên các giá trị mà người dùng đã nhập trước đó.
Thí dụ
Một biểu mẫu có tính năng tự động điền vào:
<form action="/action_page.php" autocomplete="on">
Thuộc tính Novalidate
Thuộc novalidatetính là một thuộc tính boolean.
Khi xuất hiện, nó chỉ định rằng dữ liệu biểu mẫu (đầu vào) sẽ không được xác thực khi được gửi.
Thí dụ
Biểu mẫu có thuộc tính novalidate:
<form action="/action_page.php" novalidate>
Bài tập HTML
Danh sách tất cả các thuộc tính <form>
| Thuộc tính | Sự miêu tả |
|---|---|
| bộ ký tự chấp nhận | Chỉ định các mã hóa ký tự được sử dụng để gửi biểu mẫu |
| hoạt động | Chỉ định nơi gửi dữ liệu biểu mẫu khi biểu mẫu được gửi |
| tự động hoàn thành | Chỉ định xem biểu mẫu có nên bật hay tắt tính năng tự động hoàn thành hay không |
| enctype | Chỉ định cách dữ liệu biểu mẫu sẽ được mã hóa khi gửi đến máy chủ (chỉ dành cho method = "post") |
| phương pháp | Chỉ định phương thức HTTP để sử dụng khi gửi dữ liệu biểu mẫu |
| Tên | Chỉ định tên của biểu mẫu |
| vô hiệu | Chỉ định rằng biểu mẫu sẽ không được xác thực khi được gửi |
| quan hệ | Chỉ định mối quan hệ giữa tài nguyên được liên kết và tài liệu hiện tại |
| Mục tiêu | Chỉ định nơi hiển thị phản hồi nhận được sau khi gửi biểu mẫu |