current class removed when refreshing page

Question

I have created a dynamic link list in one page...

When a click is done on one link on that dynamic list i want to show to user that link is active, so i will add one cla

Answer 1

Changing the class via AJAX only stores the information locally. So, whenever you refresh the page, this data is lost.

To get around this, you could get your page to remember this by setting a cookie.

Answer 2

Try to use localstorage() like,

$(function(){
    // if localstorage activeArea is set then add activearea class to menu
    if(localStorage && localStorage.getItem('activeArea')==1){
       $('a.areamenu').addClass("activearea");
    } 
    $('a.areamenu').click(function(){
       $('a.areamenu').removeClass("activearea");
       $(this).addClass("activearea");
       localStorage.setItem('activeArea',1);// set value in localstorage
    });
});

Answer 3

try it with PHP script like below,

Assuming page URl will be like: http://example.com/areas/categorynameNavLink/subcatnameNAV/123

<?php
$CatSelectID =  end(explode('/',curPageURL()));
?>

<li>
<a <?php if($subcatid == $CatSelectID) echo 'class="areamenu"';?> href="/areas/'.$categorynameNavLink.'/'.$subcatnameNAV.'/'.$subcatid.'/">'.$subcatname.'
</a>
</li>

<?php
function curPageURL() {
 $pageURL = 'http';
 if ($_SERVER["HTTPS"] == "on") {$pageURL .= "s";}
 $pageURL .= "://";
 if ($_SERVER["SERVER_PORT"] != "80") {
  $pageURL .= $_SERVER["SERVER_NAME"].":".$_SERVER["SERVER_PORT"].$_SERVER["REQUEST_URI"];
 } else {
  $pageURL .= $_SERVER["SERVER_NAME"].$_SERVER["REQUEST_URI"];
 }
 return $pageURL;
}
?>

Note: not tested

Answer 4

In click function use e.preventDefault()