Các thuộc tính của form:
Bạn cần chú ý đến hai thuộc tính là method và acction:
- method: giá trị của nó là POST hoặc GET, đây là cách thức gửi dữ liệu lên Server [sau này học PHP bạn sẽ được tìm hiểu]
- action: đường dẫn xử lý khi người dùng submit form
Bên trong Form là danh sách các thẻinputhoặcselecthoặctextareadùng để thu thập thông tin, và có thể có thêm các thẻ HTML khác dùng để trang trí cho Form. Chi tiết hơn thìbạn xem phần danh sách các thẻ HTML trong Form dưới đây.
Đây là form đăng ký tài khoản mới của Google, họ đã sử dụng các thẻ HTML thông thường kết hợp với các thẻ HTMLcủa formvà CSSđể tạo nên giao diện này.
2. Các thẻ HTML thu thập thông tin trong Form
Chúng ta chia làm ba nhóm chính đó là nhóminput,textareavà nhómselect,mỗi nhóm sẽ có những loại khác nhau và chức năng khác nhau dựa vào thuộc tínhtypecủa nó.. Vì nội dung của Form khá dài nên trong bài này mình chỉ giới thiệu sơ lược, các bài sau mình sẽ đi vào chi tiết và cụ thể hơn.
Danh sách các thẻ HTML trong Form:
STTTên thẻMô tả1Nhập dữ liệu ở dạng một dòng.
23Có thể chọn nhiều giá trị.
4Nhập dữ liêu ở dạng nhiều dòng.
5Nhập dữ liệu và nó sẽ được thay thế bằng các ký tự dấu chấm đen nên người dùng không nhìn thấy được.
Dữ liệu show ra dạng lựa chọn xổ xuống.
7Hiển thì một button, nếu click vào button này thì sẽ gửi dữ liệu lên Server.
8Hiển thị một button, nếu click vào button này thì các dữ liệu trong Form sẽ được xóa hết và quay lại trạng thái ban đầu.
9Hiển thị một button và nếu click vào sẽ không có tác dụng gì cả, vì vậy thông thường ta phải sử dụng Javascript để kết hợp với loại input này.
3. Lời kết
Như vậy bạn đã biết được ý nghĩa và tầm quan trọngcủa Form trong các ứng dụngwebsite rồi, sau này khi làm việc bạn sẽ sử dụng khá nhiều và bạn sẽ kết hợp với Javascript để tạo hiệu ứng vàkết hợp vớiPHP để lấy thông tin lưu vào cơ sở dữ liệu.
Bài tiếp theo chúng ta sẽ tìm hiểu các nhóm một cách cụ thể hơn, và bài đầu tiên chúng ta sẽ tìm hiểu về thẻinput.