Cách giữ lại các giá trị biểu mẫu sau khi gửi trong HTML

Bất cứ khi nào người dùng thêm một số dữ liệu không hợp lệ vào biểu mẫu và gửi nó, trang sẽ phải làm mới để hiển thị lỗi, trong trường hợp bạn không sử dụng JavaScript hoặc thứ gì đó tương tự

Tin xấu là dữ liệu đầu vào sẽ biến mất, điều này có thể rất khó chịu, đặc biệt nếu biểu mẫu có nhiều trường

May mắn thay, có hai phương pháp đơn giản mà bạn có thể sử dụng

Điều này chỉ hoạt động khi gửi, thành công hoặc không thành công (nếu kích hoạt lỗi xác thực). Nó không hoạt động khi làm mới trang đơn giản (F5) nếu dữ liệu chưa được gửi trước. Bạn sẽ cần một số JavaScript cho điều đó

1. Giữ dữ liệu biểu mẫu được làm mới bằng toán tử ternary PHP

Toán tử bậc ba là phiên bản ngắn hơn và thiết thực hơn của câu lệnh if/else tiêu chuẩn

Nó được sử dụng như thế này

<?php $a ? $b : $c;

Điều này chuyển thành một cái gì đó như thế này

<?php
    if ($a) {
        // do $b
        $b;
    } else {
    // do $c
        $c;
    }

Vì vậy, để sử dụng điều này trong một biểu mẫu để ghi nhớ dữ liệu sau khi người dùng nhấn gửi và trang được làm mới, bạn sẽ phải thêm điều này vào thuộc tính

<?php
    if ($a) {
        // do $b
        $b;
    } else {
    // do $c
        $c;
    }

<?php echo isset($_POST['name']) ? htmlspecialchars($_POST['name'], ENT_QUOTES) : ''; ?>

Bạn nên bọc đầu ra trong htmlspecialchars() để bảo mật

Vì vậy, thẻ HTML đầu vào sẽ trông như thế này

<input name="name" type="text" value="<?php echo isset($_POST['name']) ? htmlspecialchars($_POST['name'], ENT_QUOTES) : ''; ?>">

Điều này làm là hiển thị dữ liệu trong trường

<?php
    if ($a) {
        // do $b
        $b;
    } else {
    // do $c
        $c;
    }

2. Giữ cho dữ liệu biểu mẫu được làm mới bằng toán tử kết hợp Null PHP

Trong PHP 7, toán tử kết hợp null đã được giới thiệu, tương đương với toán tử ternary, nhưng ngắn hơn

Đây

<?php echo $_POST['name'] ?? ''; ?>

tương đương với cái này

<?php echo isset($_POST['name']) ? $_POST['name'] : ''; ?>

Vì vậy, để giữ cho dữ liệu đầu vào được gửi và làm mới, hãy sử dụng nó trong thuộc tính

<?php
    if ($a) {
        // do $b
        $b;
    } else {
    // do $c
        $c;
    }

<input type="text" name="name" value="<?php echo $_POST['name'] ?? ''; ?>">

Nhưng, một lần nữa, bạn nên sử dụng

<?php
    if ($a) {
        // do $b
        $b;
    } else {
    // do $c
        $c;
    }

<?php
    if ($a) {
        // do $b
        $b;
    } else {
    // do $c
        $c;
    }

Lưu ý rằng bạn phải thêm toán tử bên trong hàm

<?php
    if ($a) {
        // do $b
        $b;
    } else {
    // do $c
        $c;
    }

Không phải lúc nào bạn cũng có thể tận dụng thuộc tính giá trị HTML

Có những trường hợp bạn không thể sử dụng thuộc tính

<?php
    if ($a) {
        // do $b
        $b;
    } else {
    // do $c
        $c;
    }

Hãy lấy thẻ HTML

<?php
    if ($a) {
        // do $b
        $b;
    } else {
    // do $c
        $c;
    }

<?php
    if ($a) {
        // do $b
        $b;
    } else {
    // do $c
        $c;
    }

Để giữ cho dữ liệu luôn được làm mới trong thẻ

<?php
    if ($a) {
        // do $b
        $b;
    } else {
    // do $c
        $c;
    }

<?php echo isset($_POST['name']) ? htmlspecialchars($_POST['name'], ENT_QUOTES) : ''; ?>

<?php echo isset($_POST['name']) ? htmlspecialchars($_POST['name'], ENT_QUOTES) : ''; ?>

Vì vậy, bạn sẽ phải thêm nội dung như thế này vào thẻ

<?php echo isset($_POST['name']) ? htmlspecialchars($_POST['name'], ENT_QUOTES) : ''; ?>

<?php
    if ($a) {
        // do $b
        $b;
    } else {
    // do $c
        $c;
    }

Nếu

<?php
    if ($a) {
        // do $b
        $b;
    } else {
    // do $c
        $c;
    }

<?php echo isset($_POST['name']) ? htmlspecialchars($_POST['name'], ENT_QUOTES) : ''; ?>

<?php echo isset($_POST['name']) ? htmlspecialchars($_POST['name'], ENT_QUOTES) : ''; ?>

Đây là toàn bộ phần

<?php
    if ($a) {
        // do $b
        $b;
    } else {
    // do $c
        $c;
    }

Cẩn thận với

<?php echo isset($_POST['name']) ? htmlspecialchars($_POST['name'], ENT_QUOTES) : ''; ?>

Không giống như đầu vào,

<?php echo isset($_POST['name']) ? htmlspecialchars($_POST['name'], ENT_QUOTES) : ''; ?>

<?php echo isset($_POST['name']) ? htmlspecialchars($_POST['name'], ENT_QUOTES) : ''; ?>

Vì vậy, bạn cần đặt toán tử PHP giữa các thẻ, không phải bên trong

<?php
    if ($a) {
        // do $b
        $b;
    } else {
    // do $c
        $c;
    }

Tôi đã phạm sai lầm này, tất nhiên. 😃

Điều này sẽ không hoạt động đối với đầu vào tệp

Các phương pháp trên sẽ không hoạt động đối với đầu vào Tệp vì lý do bảo mật

Và tôi không biết về bất kỳ cách giải quyết nào khác với PHP. Có lẽ với một số Javascript

Vì vậy, người dùng sẽ phải tải tệp lên lại nếu trang làm mới nhưng biểu mẫu không được gửi thành công

Đó là một bọc

Tôi hy vọng bạn tìm thấy bài viết hữu ích và toàn diện

Nếu một số thông tin đã lỗi thời hoặc không chính xác hoặc bạn có bất cứ điều gì cần thêm, nói hoặc hỏi, vui lòng liên hệ với tôi qua Twitter hoặc email

Giới thiệu về Radu

Tôi đã làm việc trực tuyến tại nhà được hơn 9 năm. Tôi đã học được rất nhiều thứ khác nhau liên quan đến các trang web. Chuyên môn chính của tôi là WordPress, nhưng trong một thời gian, chúng tôi chia tay nhau và tôi bắt đầu tập trung hơn vào phát triển web

Cách hiển thị dữ liệu biểu mẫu sau khi gửi trong HTML?

Làm cách nào để giữ giá trị biểu mẫu sau khi gửi JavaScript?

Điều gì xảy ra khi một biểu mẫu được gửi HTML?

Làm cách nào để giữ lại các giá trị trong hộp văn bản sau khi gửi JavaScript?