📘Bài 17 — Form HTML + PHP📝

#laptrinhphpcoban

x0

Sau khi học biến, điều kiện, vòng lặp, hàm và mảng, đã đến lúc tạo ra những trang web có thể nhận dữ liệu từ người dùng.

Đây chính là bước đầu tiên để xây dựng:

✅ Form đăng nhập
✅ Form liên hệ
✅ Form đăng ký thành viên
✅ Form tìm kiếm
✅ Form quản trị dữ liệu

---

📝 Form HTML là gì?

Form là nơi người dùng nhập dữ liệu và gửi về máy chủ PHP xử lý.

Ví dụ:

<form>
    <input type="text">
    <button>Gửi</button>
</form>

---

🚀 Cấu trúc Form cơ bản

<form method="post" action="">
    <input type="text" name="username">

    <button type="submit">
        Gửi
    </button>
</form>

Ý nghĩa:

Thành phần	Chức năng
form	Khung chứa dữ liệu
method	Cách gửi dữ liệu
action	File xử lý
input	Ô nhập dữ liệu
button	Nút gửi

---

📌 Thuộc tính method

Có 2 kiểu gửi dữ liệu phổ biến:

GET

<form method="get">

POST

<form method="post">

---

🔍 Method GET

GET gửi dữ liệu lên URL.

Ví dụ:

<form method="get">
    <input name="name">

    <button>Gửi</button>
</form>

Nhập:

Nguyen Van A

URL sẽ thành:

localhost/form.php?name=Nguyen+Van+A

PHP nhận dữ liệu:

<?php

echo $_GET['name'];

?>

Kết quả:

Nguyen Van A

---

🎯 Ưu điểm của GET

✅ Dễ kiểm tra dữ liệu

✅ Có thể bookmark

✅ Có thể chia sẻ URL

Ví dụ:

search.php?keyword=php

---

⚠️ Nhược điểm của GET

❌ Hiển thị dữ liệu trên URL

❌ Không phù hợp mật khẩu

❌ Giới hạn độ dài

Sai:

login.php?password=123456

---

📮 Method POST

POST gửi dữ liệu trong phần thân request.

Không hiển thị trên URL.

Ví dụ:

<form method="post">

    <input name="username">

    <button>Gửi</button>

</form>

PHP:

<?php

echo $_POST['username'];

?>

---

🎯 Ưu điểm của POST

✅ Bảo mật hơn GET

✅ Gửi được dữ liệu lớn

✅ Dùng cho đăng nhập

✅ Dùng cho upload file

---

📌 So sánh GET và POST

🔢	⚙️ GET	📮 POST
1️⃣	Hiện trên URL	Không hiện URL
2️⃣	Dữ liệu nhỏ	Dữ liệu lớn
3️⃣	Kém bảo mật	Bảo mật hơn
4️⃣	Tìm kiếm	Đăng nhập
5️⃣	Bookmark được	Không bookmark

---

🎯 Thuộc tính action

action xác định file nhận dữ liệu.

Ví dụ:

<form method="post"
      action="save.php">

Khi submit:

save.php

sẽ xử lý dữ liệu.

---

📌 action cùng file

Thông dụng nhất:

<form method="post" action="">

hoặc:

<form method="post">

Dữ liệu sẽ gửi lại chính file hiện tại.

---

🚀 Ví dụ hoàn chỉnh

<form method="post">

    <input
        type="text"
        name="fullname">

    <button type="submit">
        Gửi
    </button>

</form>

<?php

if(isset($_POST['fullname']))
{
    echo "Xin chào "
         . $_POST['fullname'];
}

?>

Kết quả:

Xin chào Nguyễn Văn A

---

📌 isset() là gì?

Kiểm tra dữ liệu có tồn tại hay không.

if(isset($_POST['fullname']))
{
    echo "Đã gửi";
}

Nếu không kiểm tra:

echo $_POST['fullname'];

có thể phát sinh cảnh báo:

Undefined array key

---

🎯 Form nhiều trường dữ liệu

<form method="post">

    <input
        type="text"
        name="name">

    <input
        type="email"
        name="email">

    <button>
        Gửi
    </button>

</form>

PHP:

<?php

echo $_POST['name'];

echo "<br>";

echo $_POST['email'];

?>

---

🎯 Form đăng nhập đơn giản

<form method="post">

    <input
        type="text"
        name="user">

    <input
        type="password"
        name="pass">

    <button>
        Đăng nhập
    </button>

</form>

<?php

if(isset($_POST['user']))
{
    echo "User: "
         . $_POST['user'];
}
?>

---

⚠️ Lưu ý quan trọng

Không bao giờ tin dữ liệu người dùng.

Ví dụ:

$_POST['name']

có thể chứa:

<script>
alert(1)
</script>

Bài tiếp theo sẽ học cách:

✅ Kiểm tra dữ liệu

✅ Loại bỏ khoảng trắng

✅ Chống XSS

✅ Validate form

---

🧪 Bài tập thực hành

Tạo form gồm:

• Họ tên

• Email

• Tuổi

Khi nhấn Gửi:

Hiển thị:

Họ tên: ...
Email: ...
Tuổi: ...

---

🏆 Tổng kết

Sau bài học này bạn đã biết:

✅ Tạo form HTML

✅ method GET

✅ method POST

✅ action

✅ $_GET

✅ $_POST

✅ isset()

Ở bài tiếp theo chúng ta sẽ học cách bảo vệ dữ liệu đầu vào bằng Validate Form để tránh lỗi và tăng tính bảo mật cho website.

quay về MỤC LỤC