Warn user before leaving web page with unsaved changes

Thảo luận trong 'Lập trình Javascript, js' bắt đầu bởi seolagi, 29/1/24.

  1. seolagi
    Tham gia ngày:
    16/4/14
    Bài viết:
    1,044
    Đã được thích:
    81
    Điểm thành tích:
    48
    Trình duyệt hỏi mỗi khi thoát save, Warn user before leaving web page with unsaved changes, Confirm Leave save page asp.net mvc itseovn, Warn Users When Leaving a Page in React with beforeunload, How to display a warning before leaving the web page, Saving User Data with Javascript upon Exiting a Page, Display Warning for Unsaved Form Data on Page Exit, Changes you made may not be saved alert on page leave, Warn users before leaving a page with unsaved changes.

    Mình cần xin code nhỏ gọn, dễ sử dụng cái thoát khỏi trang web mỗi khi xử lý dữ liệu ở admin mà user chưa save dữ liệu lại, hoặc khi có phát sinh thay đổi trên giao diện thì sẽ hỏi xem có chắc chắn muốn rời khỏi hay không.

    Ví dụ như thông báo ở dưới, nếu user thành viên đang sử trang sản phẩm, ho quên lưu, mà thoát ra, hoặc tắt trình duyệt nó sẽ thông báo như dưới.

    Mình cần cho web asp.net MVC và code web PHP, wordpress, còn tốt nhất có code nào bằng javascript sử dụng được cho đa ngôn ngữ lập trình thì càng tốt.

    thong-bao-roi-khoi-trang.jpg
     
    Cảm ơn đã xem bài:

    Warn user before leaving web page with unsaved changes

  2. admin
    Tham gia ngày:
    22/5/13
    Bài viết:
    4,992
    Đã được thích:
    1,215
    Điểm thành tích:
    113
    Giới tính:
    Nam
    Cái này mình sử dụng code javascript sau có thể xài cho mọi ngôn ngữ lập trình web nhé, chỉ cần dán nó vào head hay footer của web là ok nhé:
    Mã:
    <script type="text/javascript">
        //xử lý hỏi mỗi khi rời trang
        $(window).on("beforeunload", function () {
            return "Are you sure? You didn't finish the form!";
        });
        $(document).ready(function () {
            $(".btnnotbfload").on("click", function (e) {
                //check form to make sure it is kosher
                //remove the ev
                $(window).off("beforeunload");
                return true;
            });
        });
    </script>
    
    Tiếp theo add class: btnnotbfload vào cái button xử lý lưu/save không cần bắt sự kiện hỏi khi save.
    Mã:
    <button class="btnnotbfload">Lưu</button>
     
    Chỉnh sửa cuối: 29/1/24