• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 426
  • Last Modified:

jQuery remember click with persistent cookie

Hi Experts,

I have a navigation menu which is reloaded every time you load a page. I would like to add a class to the last clicked link in the navigation which persists when the next page loads i.e when I click on the Second Page link, SecondPage.html loads and the link still has that class, indicating that this is the active page.

I'd like to do this with jQuery and a persistent cookie. With the code attached, I can get the click to add the class to the selected link and remove it from the others. I'm just not sure how to add in the cookie code.

Any help would be greatly appreciated.
<script type="text/javascript">
$(document).ready(function(){

    $("#nav h3.Heading").click(function () {  

        $("#nav h3.Heading").removeClass("activeLink"); 
        $(this).addClass("activeLink");      
        });

 });
 </script>

Open in new window

0
b24
Asked:
b24
  • 4
  • 2
1 Solution
 
leakim971PluritechnicianCommented:
0
 
b24Author Commented:
Hi leakim971,

I'll try to get something from that thread but I really don't know much about it and trying to adapt it from a button input to a navigation click might prove tricky for me.

Thanks.
0
 
b24Author Commented:
Hi experts,

Can anyone else offer some help with this question?

Many Thanks!
0
Technology Partners: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

 
leakim971PluritechnicianCommented:
using : http://plugins.jquery.com/project/Cookie

if you want to record the state of something your need to be able to point this element.
you can point it multiple way :
- a unique name (form field)
- a unique class
- a unique id
- a unique position (ex : the third div)

once you find a ultimate way to point each of element for which you want to save the class, use $.cookie to save an retrieve

for example using position from other element :

var position = $(this).index("#nav h3.Heading");
$.cookies("position", position); // set the cookie for the current activeLink

at page load:

var position = $.cookies("position"); // retrieve the last activeLink position
if( position != null ) $("#nav h3.Heading:eq(" + position  + ")");

0
 
b24Author Commented:
Hi leakim971,

I need to be able to click on a link, add a class to it and then remember which link has been clicked so that the class is still attached when the page loads.

I don't think position is going to work for that.

0
 
b24Author Commented:
Hi Leakim971,

I've decided to abandon the cookie idea and go for a location.pathname solution instead. That doesn't mean that the solution you offered above wouldn't have worked, I just decided to go in a different direction.

Thanks very much for your help.
0

Featured Post

Concerto Cloud for Software Providers & ISVs

Can Concerto Cloud Services help you focus on evolving your application offerings, while delivering the best cloud experience to your customers? From DevOps to revenue models and customer support, the answer is yes!

Learn how Concerto can help you.

  • 4
  • 2
Tackle projects and never again get stuck behind a technical roadblock.
Join Now