Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

...

This article demonstrates a way to display a pop-up to remind the user to refresh the page (if it contains a form) after a fixed interval, to avoid hitting a 403 forbidden page due to CSRF token expiration upon submission.

Displaying image.pngImage RemovedImage Added


How To

Including SweetAlert2 JavaScript in UI Sub Header or Sub Footer

Image Modified

Code Block
languagexml
<script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>

...

Adding Code in UI Custom JavaScript

Image Modified

Code Block
languagejs
var sessionTimeoutId = null;
$(document).on('page_loaded', function(){
    clearTimeout(sessionTimeoutId);
    if($('form').length > 0){
        sessionTimeoutId = setTimeout(function(){
            Swal.fire({
                title: '',
                html: 'The page has expired due to inactivity.<br>Please refresh and try again.',
                icon: 'warning',
                allowOutsideClick: false, 
                allowEscapeKey: false,  
                showConfirmButton: true,
                showCancelButton: true,
                confirmButtonText: 'Refresh',
                cancelButtonText: 'Cancel',
                confirmButtonColor: 'var(--theme-button-bg)',
            }).then((result) => {
                if (result.isConfirmed) {
                    $("#content.page_content").addClass('ajaxloading');
                    $("#content.page_content").attr('data-content-placeholder', 'form');
                    location.reload();
                }
            });
        }, 1800000);
    }
})

...