Cách lấy dữ liệu từ biểu mẫu HTML

Các biểu mẫu HTML được sử dụng để thu thập thông tin đầu vào từ người dùng và gửi nó đến máy chủ để xử lý.
Ví dụ là biểu mẫu đăng ký mà người dùng điền vào để đăng ký trên một trang web và biểu mẫu gửi đơn đặt hàng trên các trang web thương mại điện tử.

Cấu trúc biểu mẫu HTML

HTML có các thành phần đầu vào được hiển thị theo nhiều cách khác nhau, chẳng hạn như trường đầu vào, hộp kiểm (để chọn không hoặc nhiều lựa chọn), nút radio (để chọn một trong nhiều lựa chọn), nút gửi, v.v. Cấu trúc cơ bản của một biểu mẫu bao gồm các trường đầu vào và nút gửi. Người dùng điền vào các trường đầu vào với thông tin bắt buộc và khi nhấp vào nút gửi, dữ liệu sẽ được gửi đến trình xử lý biểu mẫu. Thông thường, trình xử lý biểu mẫu là một tệp trên máy chủ với tập lệnh để xử lý dữ liệu đầu vào

Thuộc tính hành động biểu mẫu

Bạn thêm một thuộc tính hành động vào biểu mẫu để xác định nơi gửi dữ liệu. Trong ví dụ trên, thông tin được gửi sẽ được xử lý bởi tập lệnh của nhà. tài liệu html

Trong trường hợp này, URL được gọi là tương đối. URL tương đối được so sánh với URL hiện tại được tải trong trình duyệt Web. Chúng ta có thể sử dụng dấu gạch chéo và ký hiệu “chấm kép” để giải quyết một thư mục khác hoặc thư mục mẹ của cấu trúc thư mục ảo trên máy chủ Web

URL đầy đủ được sử dụng để gửi dữ liệu biểu mẫu đến trang web hoàn toàn khác. Ví dụ: một trang Web có thể nhúng một biểu mẫu HTML để đăng ký bản tin gửi các trường biểu mẫu của nó tới một trang Web bên ngoài, nơi cung cấp dịch vụ bản tin email.

Thuộc tính phương thức biểu mẫu

Trong ví dụ sau, chúng tôi đã thêm thuộc tính phương thức HTTP vào biểu mẫu. Phương thức có thể là GET hoặc POST. Cả hai phương pháp được sử dụng để truyền dữ liệu từ máy khách đến máy chủ

Phương thức GET truyền dữ liệu trong URL bằng chuỗi truy vấn. Do đó, độ dài của URL bị hạn chế. GET thích hợp hơn cho hình ảnh, tài liệu từ hoặc dữ liệu không yêu cầu bất kỳ bảo mật nào

POST là một phương thức HTTP mã hóa dữ liệu biểu mẫu theo định dạng được chỉ định và gửi nó đến máy chủ thông qua nội dung thông báo HTTP. World Wide Web thường xuyên sử dụng POST để gửi dữ liệu do người dùng tạo hoặc tệp đã tải lên máy chủ web

Trong ví dụ trên, bạn có thể thấy mã hóa URL tiêu chuẩn được sử dụng để mã hóa các trường và URL của biểu mẫu HTML. Mã hóa URL là một chuỗi dài các cặp tên và giá trị. Mỗi cặp được phân tách với nhau bằng dấu và (&) và mỗi tên được phân tách khỏi giá trị bằng dấu bằng (=). Ví dụ. key1=value1&key2=value2

Mã hóa này có thể được sử dụng cho văn bản và các trường dữ liệu khác, nhưng nó không hỗ trợ các trường tải tệp lên. Chúng tôi có thể khắc phục hạn chế này bằng cách chuyển sang mã hóa nhiều phần

Sự khác biệt giữa phương thức GET và POST

Nếu bạn muốn gửi một hoặc hai biến đơn giản (ví dụ: tham số tìm kiếm) đến máy chủ của mình, thì bạn sử dụng GET. Tuy nhiên, nếu biểu mẫu của bạn bao gồm mật khẩu, thông tin thẻ tín dụng hoặc bất kỳ dữ liệu nào khác cần được bảo vệ thêm thì POST là lựa chọn tốt hơn. Bạn có thể xem so sánh song song giữa hai phương thức trong ví dụ bên dưới

chủ đề bài học

Trong hướng dẫn này, chúng tôi đề cập đến các chủ đề sau

• Cấu trúc biểu mẫu HTML
  

• Thuộc tính hành động biểu mẫu
  

• Thuộc tính phương thức biểu mẫu

• Sự khác biệt giữa phương thức GET và POST

Trang trình bày bài học