Làm cách nào để kiểm tra xem nút gửi có được nhấp trong HTML không?

Chúng tôi có thể gặp trường hợp khi chúng tôi có nhiều nút gửi và chúng tôi muốn phát hiện nút nào được nhấp. Trong bài viết này, chúng ta sẽ xem cách phát hiện nút gửi nào được nhấp khi một biểu mẫu được gửi bằng ngôn ngữ PHP

Hàm PHP isset() được sử dụng để kiểm tra xem một biến có được đặt hay không. Hàm isset() trả về giá trị boolean (true hoặc false). Vì vậy, chúng tôi có thể phát hiện lần nhấp vào nút gửi bằng hàm PHP isset()

Khi nút gửi được nhấp qua nút chuột hoặc nút nhập trên bàn phím, trình duyệt sẽ gửi tên và giá trị của nút một cách an toàn khi phương thức POST được sử dụng

Hãy gán một tên duy nhất cho mỗi nút gửi, nếu bạn sử dụng các tên giống nhau thì bạn sẽ nhận được kết quả không hợp lệ

Biểu mẫu HTML là

Bây giờ chúng ta đã gán các tên duy nhất cho mỗi đầu vào, bây giờ chúng ta cần viết một số mã PHP

Mã PHP sẽ trông như thế này

Phần “else” sẽ xử lý các yêu cầu không đến từ biểu mẫu. Rất nên áp dụng bảo mật và vệ sinh trên các biểu mẫu để ngăn chặn kẻ tấn công. Cách thực hành tốt là luôn có một phần khác cho mỗi câu lệnh "if" để xử lý các ngoại lệ

Khi một yêu cầu không hợp lệ được gửi qua biểu mẫu, bộ điều khiển biểu mẫu sẽ xử lý lỗi. Bằng cách này, bạn có thể áp dụng bảo mật một cấp trên biểu mẫu của mình, bảo mật này sẽ chỉ chấp nhận yêu cầu thực tế và các yêu cầu không hợp lệ sẽ bị loại bỏ

Trong phần trước, bạn đã biết cách lấy văn bản từ hộp văn bản khi nhấp vào nút Gửi trên biểu mẫu. Tuy nhiên, khi bạn tải trang lần đầu, văn bản vẫn hiển thị

Lý do tại sao văn bản hiển thị khi trang được tải lần đầu tiên là do tập lệnh thực thi cho dù nút có được nhấp hay không. Đây là vấn đề bạn gặp phải khi tập lệnh PHP nằm trên cùng một trang với HTML và đang được gửi tới chính nó trong thuộc tính ACTION

Để giải quyết vấn đề này, bạn có thể thực hiện kiểm tra đơn giản bằng cách sử dụng Câu lệnh IF khác. Những gì bạn làm là kiểm tra xem nút Gửi đã được nhấp chưa. Nếu đúng như vậy, thì hãy chạy mã của bạn. Để kiểm tra xem nút gửi đã được nhấp chưa, hãy sử dụng nút này

nếu ( isset( $_POST['Submit1'] ) ) { }

Bây giờ có vẻ hơi lộn xộn. Nhưng nó thực sự bao gồm ba phần

nếu ( ) { }
thiết lập( )
$_POST['Gửi1']

Bạn biết về câu lệnh if. Nhưng ở giữa các dấu ngoặc tròn, chúng ta có isset(). Đây là một chức năng sẵn có để kiểm tra xem một biến đã được đặt hay chưa. Ở giữa các dấu ngoặc tròn, bạn gõ những gì bạn muốn isset( ) để kiểm tra. Đối với chúng tôi, đây là $_POST['Submit']. Nếu người dùng vừa làm mới trang, thì sẽ không có giá trị nào được đặt cho nút Gửi. Nếu người dùng đã nhấp vào nút Gửi thì PHP sẽ tự động trả về một giá trị. Thay đổi tập lệnh của bạn từ trang trước sang trang sau và dùng thử

if (isset($_POST['Submit1'])) {

$username = $_POST['username'];

if ($username == "letmein") {

print ("Chào mừng trở lại, bạn. ");

}
khác {

print("Bạn chưa phải là thành viên của trang này");

}

}

Ghi lại vị trí của tất cả các dấu ngoặc tròn, vuông và quăn lộn xộn đó. Bỏ lỡ một lần và bạn sẽ gặp lỗi

Trong cả hai trường hợp, nhấn nút sẽ gửi biểu mẫu gốc mà không cần xử lý riêng sự kiện onclick

Nếu bạn muốn xác thực biểu mẫu trước khi gửi, trình xử lý sự kiện tốt nhất sẽ là sự kiện gửi biểu mẫu. Thí dụ

Trả về false từ trình xử lý sự kiện onsubmit của biểu mẫu sẽ dừng biểu mẫu được gửi

Vì vậy, nút gửi chỉ tồn tại có ý nghĩa trong một biểu mẫu

Nếu, bạn muốn một nút đơn giản kích hoạt một sự kiện khi nhấn/nhấp vào nút, hãy sử dụng thẻ nút với type=submit như thế này

Đó là một phần quan trọng của xử lý sự kiện. mã trình xử lý của bạn thường chạy trước khi trình duyệt thực hiện "hành động mặc định" và có cơ hội ngăn chặn hành động đó

document.getElementById('myform').addEventListener('submit', (event) => {
  const satisfactory = /* .. check various things */;
  if (!satisfactory) {
    // The default action for submitting a form is to
    // send the data to the server. Prevent that under
    // this condition.
    event.preventDefault();
  }
});

Làm cách nào để kiểm tra xem nút có được nhấp trong HTML không?