I am calling data from mysql in rows, and each ID is placed in a seperate div. Once a customer clicks on one of these div's (url) the div should remove itself and place itself in the "seen" tab. I do this by removing and adding another class.
This works perfectly, but if I am now going for example ID 15 then this one is removing itself from new to 'seen'. But the first one is resetting itself and moves to 'new' again. How can I make sure every time I click on a new url in the row it collects another one in the 'seen' tab?
PHP:
<?php while($row = mysql_fetch_array($result, MYSQL_ASSOC)) {
// output data of each row
$idselection = $row["entryId"];
echo "<div class='one-block-info' style='width: 33%; float: left; margin-top: 10px; margin-bottom: 10px; text-align: center; border: 1px solid black;'><div class='hide_div' style='font-size: 17px; color: #6A8F3B;'><br /><a class='tag-link new' style='color: rgb(106, 143, 59);' href='/offerte-formulier?id=". $idselection ."' target='_self'>ID:<span class='empty_span'> " . $idselection . "</span></a></div>
<div class='hide_div'><br />Keuken Type:<span class='empty_span'> " . $row["stijlkeuken"] . "</span></div>
<div class='hide_div' style='padding-bottom: 10px;'><br />Voornaam & Achternaam:<span class='empty_span'> " . $row["firstname"] . " " . $row["lastname"] . "</span></div></div>";
} ?>
Javascript:
$(document).ready(function() {
$("a.tag-link.new").click(function() {
var pid = $(this);
$(pid).removeClass("new");
$(pid).addClass("active");
localStorage.setItem("selectedolditem", $(pid).text());
});
var selectedolditem = localStorage.getItem('selectedolditem');
if (selectedolditem !== null) {
$("a:contains('" + selectedolditem + "')").removeClass("new");
$("a:contains('" + selectedolditem + "')").addClass("active");
}
});
So I need to make sure that every row I click should move to 'seen' tab without another one coming back. Thanks all