Categories
Development

How to change a php printed div element class attribute with jquery [closed]

I am creating a website that takes posts from a form an stores them in a database. I then display those posts from my database on my website in boxes under each other individually. I have created a search form that locates any post from a certain date and the code can locate the data from the database just fine.

The problem I am having is when I locate the date correctly I want the div element that the date is inside to change to a different class using J Query so that it can trigger different CSS properties (changing the background color as to highlight the post I have searched for.)

I have included the relevant code below:

<html>
<head>
<script src="https://code.jquery.com/jquery-2.2.4.js" integrity="sha256-iT6Q9iMJYuQiMWNd9lDyBUStIq/8PuOW33aOqmvFpqI="crossorigin="anonymous">
</script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<style>
    .wow {
        margin: 20px 0;
        padding: 20px;
        overflow: hidden;
        border: 1px solid #d9bfb7;
        border-radius: 0px;
        background-color: #f0e0d6;
        color: #333;
        width: auto;
        height: auto;
        }

    .wow2 {
        margin: 20px 0;
        padding: 20px;
        overflow: hidden;
        border: 1px solid #d9bfb7;
        border-radius: 0px;
        background-color: #f90a30;
        color: #333;
        width: auto;
        height: auto;
        }
</style>
</head>
<body>              

<?php

$host="localhost";
$username="root";
$password="";
$db_name="journal";
$tbl_name="entries";

$con=mysqli_connect("$host", "$username", "$password", "$db_name") or die ("cannot connect");

$datetime = mysqli_real_escape_string($con, trim(strip_tags(isset($_POST['datetime']) ? $_POST['datetime'] : "")));
$query = "SELECT * FROM $tbl_name WHERE DATE(datetime)='$datetime'";
$result = mysqli_query($con,$query);
$row = mysqli_fetch_array($result);

        if (isset($datetime) && !empty($datetime)) {
        if (mysqli_num_rows($result)) {
?>  

        // THIS IS WHAT I'M TRYING TO MAKE WORK

        <script type="text/javascript">
        $("#wowid").attr("class", "wow2")
        </script>



<?php
        print "<p>found a match for {$row['datetime']}</p>";    
        } else { // Query didn't execute
        print "no result found";
        }
        }

$id=(isset($_GET['id']) ? $_GET['id'] : '');
$sql="SELECT * FROM $tbl_name WHERE id='$id'";
$result=mysqli_query($con,$sql);
$rows=mysqli_fetch_array($result);

$query = 'SELECT * FROM entries ORDER BY id DESC';
if ($r = mysqli_query($con, $query)) { // Run the query.
while ($row = mysqli_fetch_array($r)) {
print "<div id='wowid' class='wow'>
        {$row['datetime']}
        No.{$row['id']}
        <br>
        {$row['post']}
        </div>";
        }
        } else { // Query didn't run.
        print '<p style="color: red;">Could not retrieve the data because:<br>' . mysqli_error($con ). '.</p><p>The query being run was: ' . $query . '</p>'; 
        }
        mysqli_close($con); // Close the connection
?>

Leave a Reply

Your email address will not be published. Required fields are marked *