Set and update global jQuery cookie

Question

I'm building a site that sets numerous cookies based on selections. The cookie updates and saves but when I navigate to another page the selections are not stored globally. I've tried using path: / and it only remembers the selections when I visit that page.

I'm storing a cookie that renders a list in a panel of selected options and its also stored in a hidden field.

I've got some code below, is the path in the correct place?

jQuery(document).ready(function () {

    jQuery("ul.activities_list").append(jQuery.cookie("listItem"), {
                expires: 7,
                path: '/'
            }); //<---end of $.cookie);
  jQuery(".activity").on("click", ".add_activity", function() {

   // jQuery(".add_activity").live('click',function () {
        var title = jQuery(this).parent().parent().find('.title').html();

        // Add activity item to the panel list.
        jQuery("ul.activities_list").prepend(jQuery('<li>'+title+'<button id="remove_item" class="button is-primary is-white">Remove</button></li>'));

        jQuery.cookie("listItem", ((jQuery.cookie("listItem") ? jQuery.cookie("listItem") : '') + jQuery('<li>'+title+'<button id="remove_item" class="button is-primary is-white">Remove</button></li></li>').clone().wrap('<div />').parent().html(), '/'));
        jQuery.cookie("listItemTitle", ((jQuery.cookie("listItemTitle") ? jQuery.cookie("listItemTitle") : ', ') + title));
   console.log(jQuery.cookie("listItem")) });
    jQuery("#remove_item").live('click',function () {

        jQuery(this).parent().remove();
        var removed_item = jQuery('.activities_list').html();

        jQuery.cookie("listItem", removed_item);
        jQuery.cookie("listItemTitle", removed_item);

    });
});```

Regarding the use of .live(): Note: This API has been removed in jQuery 1.9; please use on() instead. — Rob Moll, Oct 09 '19 at 17:33
Thanks Rob, it's been commented out as it was a part of the original code and uses .on() as per the line above :) — Paddy Winsley, Oct 09 '19 at 17:50
For what it's worth, there is one more here: `jQuery("#remove_item").live('click',function () {` — Rob Moll, Oct 09 '19 at 17:58
In a word, no, your code is not in the correct place `jQuery("ul.activities_list").append(jQuery.cookie("listItem") ` <-- ends jQuery.cookie call `, { expires: 7, path: '/' }` <-- used as a second parameter to `append` `);` <-- ends `append` call. I'm not sure why you're appending the result of `jQuery.cookie()` to an HTML element anyway, but that's a different problem. — Heretic Monkey, Oct 09 '19 at 18:42

score 0 · Answer 1 · answered Oct 09 '19 at 18:36

This should help:

$.cookie("test", 1, {
   expires : 10,           // Expires in 10 days

   path    : '/',          // The value of the path attribute of the cookie
                           // (Default: path of page that created the cookie).

   domain  : 'jquery.com', // The value of the domain attribute of the cookie
                           // (Default: domain of page that created the cookie).

   secure  : true          // If set to true the secure attribute of the cookie
                           // will be set and the cookie transmission will
                           // require a secure protocol (defaults to false).
});

To read back the value of the cookie:

var cookieValue = $.cookie("test");

You may wish to specify the path parameter if the cookie was created on a different path to the current one:

var cookieValue = $.cookie("test", { path: '/foo' }); How do I set/unset a cookie with jQuery?

Set and update global jQuery cookie

1 Answers1