Pfthb

I want to indicate the currently newly added user through symbol or unique color, like when someone click on Save and the user that is added should be shown in a different color or highlighted at that glimpse and then disappear after refresh, something like what the stackoverflow does in commenting system.

This is my code of index.php in this page I'v form and after submitting this form I' added the user to the database and then I'v shown them in descending order

 <form action="save.php" method="post">
 <div class="text-center" id='input_tag'>
 <input type="text" name="name" id= 'input'>
 <input type="submit" name="submit" class="btn btn-dark " id = "button" value="Save">
 </div>
 </form>
 <div class="container">
 <div class="row">

 <div class="col-md-4">
 <table width="100" class="table" id = 'tb'>
 <?php 
 $connect = mysqli_connect('localhost','root','root','user');
 $query = "SELECT name from userdata order by id DESC";

 $run = mysqli_query($connect,$query);


 while($row = mysqli_fetch_array($run))
 

 echo "<tr>";
 echo "<td>".$row['name']."<td>";
 echo "</tr>";

 



 ?>


 </table>
 </div>


 </div>
</div>

This is save.php where the user are added to DB and then redirected to the index.php page

$connect = mysqli_connect('localhost', 'root' ,'root' ,'user');

if($connect)
 if(isset($_POST['submit']))
 
 $name = $_POST['name'];
 $query = "INSERT INTO `userdata`(`name`) values ('$name')";

 if(mysqli_query($connect,$query))
 header('location:index.php');

 
 


else
 echo "not connected";

You can achieve this with simple CSS and JS.

Change the header function in save.php to

header('location:index.php?added=1');

Add CSS style to index.php

<style type="text/css">
 tr:last-of-type 
 transition: .7s background;
 
 </style>

At the end of index.php add the following

 <?php
 if (isset($_GET['added']))
 print '<script type="text/javascript">

 document.querySelector("tr:first-of-type").style.background = "red";
 setTimeout(function() document.querySelector("tr:first-of-type").style.background = unset",2000);
 </script>';

 

 ?>

I'm assuming that the new user is going to be displayed at first.

If you want to display the user differently the first time, then you will need
some sort of flag that says if the user has been shown yet or not.
At the time you insert the user, set the didShow flag to false.
When you show the user, check the flag and if false, show the user
with the symbol and set the didShow flag to true.
When you show the user, if the didShow flag is false, show the
user without the symbol.

Add a new column named didShow to your database. Set it to default to 0 (false).

Change the query like this:

$query = "SELECT id, name, didShow from userdata order by id DESC";

In the loop, use different formatting and update the rows that have to be updated.

$run = mysqli_query($connect, $query);
$style = 'style="color:#ccc"';
while($row = mysqli_fetch_array($run))

 echo "<tr>";
 if ( $row['didShow'] == 0 ) 
 echo "<td><span $style>".$row['name']."</span><td>";
 $updateQuery = "UPDATE `userdata` SET didShow=1 WHERE id = $row['id']";
 mysqli_query($connect, $updateQuery);
 else 
 echo "<td>".$row['name']."<td>";
 
 echo "</tr>";