Menu
I have a single [webpage
The user can click on each row to highlight it and JS code changes the CSS style of that row and vice versa if it’s highlighted will remove the style.
They can also clear all styles by clicking on a link at the top of the page.
All the information is stored using `localstorage
What I am trying to achieve now is
– make the favourites or highlighted rows to also appear at the top also to save people scrolling.– Clear the localstorage variable when they arrive on the site after a certain date but only clear it the once e.g. as in don’t clear it each time they arrive after a date.
My questions are
– is it possible to use the localstorage variable in PHP to pass those values to a query and replicate them in a new header table.– Maybe there is a better way to implement what I want to do and someone might suggest the process and I’ll investigate and try to develop a solution. I am eventually trying to get it somewhat similar to this [page
“`
<script>
$(‘#clearHighlights’).click(function(){ window.localStorage.clear(“storedEntries”); return false; });
if(localStorage.getItem(‘storedEntries’) === null){
var selectedTeams = [];
}else{
var selectedTeams = JSON.parse( window.localStorage.getItem(‘storedEntries’) );
var arrayLength = selectedTeams.length;
console.log(arrayLength);
for (var i = 0; i < arrayLength; i++) {
document.getElementById(selectedTeams[i]).className = “highlight”;
}
}
var teamIndex;
$(‘#leaderboard’).on(‘click’, ‘tr’, function() {
if($(this).hasClass(‘highlight’)){
$(this).removeClass(‘highlight’)
teamIndex = selectedTeams.indexOf(this.getAttribute(‘id’))
selectedTeams.splice(teamIndex,1)
window.localStorage.setItem(‘storedEntries’,JSON.stringify(selectedTeams));
}
else {
$(this).addClass(‘highlight’)
selectedTeams.push(this.getAttribute(‘id’))
window.localStorage.setItem(‘storedEntries’,JSON.stringify(selectedTeams));
}
});
</script>