John Davidson

Message:

1st time asking here!
I have a MySQL SELECT query and array of results. I have a container and within that container I want to display child div(s) displaying the array result + JQuery to add some nice fadeIn and fadeOut. The issue is the script display some of the array but NEVER all. I have 7 but the page shows 5 sometimes even 2 only and the data seems to be picked randomly.

// Fetch user notifications

$stmt0 = $conn->prepare("SELECT notifid, notification FROM notifications WHERE userid = :userid AND username = :uname;");

$stmt0->execute(['userid' => $userid, 'uname' => $username]);

$results0 = $stmt0->fetchAll();

foreach ($results0 as $row0) { 

$notifid = $row0['notifid'];  

$notification = $row0['notification'];

$notificationid = substr(sha1(mt_rand()), 0, 8);

echo "<div class='bluenot' id='".$notificationid."'>&#10004; <b><i>$notification</i></b></div>";

echo '<script>

$(document).ready(function(){

        var notifid = ' . $notificationid . ';

        $("#notifybox").append($ (notifid) );

        setTimeout(function() {

        $(notifid).fadeIn("fast", function () { $(this).delay(5000).fadeOut("fast"); });

        $(notifid).css("display", "block");});

 

});

</script>';

CSS :

.notifybox {

        width: auto;

        height: auto;

        position: fixed;

        bottom: 0;

        left: 15px;

        z-index: 1000 important;

}



.bluenot {

    width: 400px;

    height: 80px;

    padding: 20px 40px 20px 40px;

    margin-top: 8px;

    margin-bottom: 8px;

    display: none;

    background: #aaa9ff;

    border-left: #2933aa 10px solid;

    border-radius: 10px;

    color: #353759;

    text-align: center;

}

SOLVED:
Made a copy of class .bluenot and named it .dbnot then changed the code to :

echo "<div class='dbnot' id='".$notificationid."'>&#10004; <b><i>$notification</i></b></div>";

echo '<script>

        $("#notifybox").append($ (".dbnot") );

        $(".dbnot").fadeIn( 800 ).delay( 1000 ).fadeOut( 400 ).$(".dbnot").css("display", "block");

</script>';

Hope this helps anyone who would face the same issue.

---

My Answer:
't directly interact with each other. JQuery is a JavaScript library that is used for client-side scripting, while PHP is a server-side scripting language. However, you can use JQuery to make AJAX requests to a PHP script on the server to retrieve data or perform actions without reloading the page. This allows for dynamic and interactive web applications.