Toast Message Using Sweet Alert

185 views Asked by At

I'm having problem with my toast message. instead of the toast popup right after i fill the form submission, the toast keeps appear even i don't submit form submission and even i'm from another page i click to this page the toast still appear. Other than that, after i put unset in the code based on bard a.i, the toast not appear at all.

this is from page1.php

<html>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/sweetalert2.min.css">
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/sweetalert2.min.js"></script>
</html>
<?php
    session_start();
    include 'config.php';
    
    if (isset($_SESSION['id_pensyarah'])) {
        $idpensyarah = $_SESSION['id_pensyarah'];
    
        if (isset($_POST['insertakademik'])) {
            $tahun = $_POST['tahunakademik'];
            $pencapaian = $_POST['pencapaianakademik'];
            $id_institusi = $_POST['id_institusi'];
            $institusi_baharu = $_POST['institusiakademikbaharu'];

            if ($institusi_baharu == null) {
                // Insert into akademik table directly using the selected id_institusi
                $sql1 = "INSERT INTO akademik (tahun, pencapaian, id_pensyarah, id_institusi) VALUES ('$tahun', '$pencapaian', '$idpensyarah', '$id_institusi')";
                $execute1 = mysqli_query($conn, $sql1);

                if ($execute1) {
                    $_SESSION['success_message'] = "Tambah Data Kelayakan Akademik dan Ikhtisas";
                    $_SESSION['redirect_token'] = uniqid();
                    header('Location: .././page2.php');
                } else {
                    echo 'Error execute1 data: ' . mysqli_error($conn);
                }
            } else {
                // Insert the new institution into institusi table first
                $sql2 = "INSERT INTO institusi (institusi) VALUES ('$institusi_baharu')";
                $execute2 = mysqli_query($conn, $sql2);
            
                if ($execute2) {
                    // Get the last inserted ID and insert into akademik table
                    $new_id_institusi = mysqli_insert_id($conn);
                    $sql3 = "INSERT INTO akademik (tahun, pencapaian, id_pensyarah, id_institusi) VALUES ('$tahun', '$pencapaian', '$idpensyarah', '$new_id_institusi')";
                    $execute3 = mysqli_query($conn, $sql3);

                    if ($execute3) {
                        $_SESSION['success_message'] = "Tambah Data Kelayakan Akademik dan Ikhtisas";
                        header('Location: .././page2.php');
                    } else {
                        echo 'Error execute3 data: ' . mysqli_error($conn);
                    }
                } else {
                    echo 'Error execute2 data: ' . mysqli_error($conn);
                }

            }
        }
    }
    
    
?>

this is from page2.php

<!-- Toast Insert Data Successfully -->
<?php
        if (isset($_SESSION['success_message']) && isset($_SESSION['redirect_token'])) {
            echo "<script>
                Swal.fire({
                    position: 'top-end',
                    toast: true,
                    icon: 'success',
                    title: '" . $_SESSION['success_message'] . "',
                    text: 'Berjaya!',
                    showConfirmButton: false,
                    timer: 3000,
                    timerProgressBar: true,
                    backgroundColor: '#28a745',
                    titleColor: '#fff',
                })
                .then((result) => {
                    // Clear the session variable after toast is dismissed (using AJAX)
                    $.ajax({
                        url: 'clear_session.php',
                        success: () => {
                            console.log('Session cleared successfully');
                        }
                    });
                });
            </script>";
        }
?>

I want the toast to popup right after i submit form submission from another page. After i submit the form, the form will go to the next location and then the toast will popup.

1

There are 1 answers

0
Ken Lee On

Since I do not see the contents of clear_session.php, I cannot comment on what it can do. On the other hand, please be informed that ajax is , by default, asynchronous in nature, so make sure that the ajax action is completed before leaving the page.

For your case, instead of calling ajax to clear the session, you may consider simply clearing the session variables right after you enter the if-conditional block, say using the following

unset($_SESSION['success_message']);
unset($_SESSION['redirect_token']);

so for page 2, change to

<?php
session_start();

if (isset($_SESSION['success_message']) && isset($_SESSION['redirect_token'])) {

unset($_SESSION['success_message']);
unset($_SESSION['redirect_token']);

            echo "<script>
                Swal.fire({
                    position: 'top-end',
                    toast: true,
                    icon: 'success',
                    title: '" . $_SESSION['success_message'] . "',
                    text: 'Berjaya!',
                    showConfirmButton: false,
                    timer: 3000,
                    timerProgressBar: true,
                    backgroundColor: '#28a745',
                    titleColor: '#fff',
                })
                .then((result) => {

                });
            </script>";
     
// rest of your code

By the way, make sure you have session_start(); at the top of the script