How to delete a specific value in a cookie - jquery

Question

I am developing a shopping cart system, where the user can add or remove products to his or her basket.

I am storing 2 things for each product in the product cookie: product barcode and price.

My code so far looks like this:

var addToBasketHandler = $(".add-product");
var removeFromBasketHandler = $(".unselect");

var Basket = {

    select: function (box, cookie) {

        box.addClass("selected");
        var ean = box.attr('ean');
        var value = box.find($(".price strong")).html().replace(/[^0-9\.]/g, '');

        if ($.cookie(cookie) == undefined) {
            $.cookie(cookie, ean + "~" + value);
        } else if ($.cookie(cookie).indexOf(ean) == -1) {
            $.cookie(cookie, $.cookie(cookie) + "|" + ean + "~" + value);
        }


    },

    deselect: function (box, cookie) {

        box.removeClass("selected");

        //  code to delete the cookie value

    }

};

$(document).ready(function () {

    $(addToBasketHandler).click(function () {

        var box = $(this).parents(".box-offer");
        Basket.select(box, "productCookie");

    });

    $(removeFromBasketHandler).click(function () {

        var box = $(this).parents(".box-offer");
        Basket.deselect(box, "productCookie");

    });

});

And after adding 3 products to my cart, my cookie looks like this:

productCookie = 9918430821007~12.00 | 7C9918430831006~3.00 | 7C7501031311309~50.30

Please help on how I could remove only the selected product from this cookie list above.

FYI I am using jquery + jquery cookie

http://stackoverflow.com/questions/1458724/how-to-set-unset-cookie-with-jquery — ngonhan, Mar 13 '14 at 06:32
Nope, that discussion is about changing the whole cookie value, whereas in my case i only need to know how to remove one value (barcode+ean) and the rest remains the same in the cookie :) — Wasiim, Mar 13 '14 at 06:35

Tushar Gupta - curioustushar · Accepted Answer · 2014-03-13T07:16:50.120

1

Try

deselect: function (box, cookie) {
    box.removeClass("selected");
    var ean = box.attr('ean');
    var value = box.find($(".price strong")).html().replace(/[^0-9\.]/g, '');
    var val = ean + "~" + value; //value to be removed
    if ($.cookie(cookie) !== undefined) {
        var cookie_val = $.cookie(cookie);
        if (cookie_val.indexOf(val) !== -1) { //check value present in cookie
            var arr = cookie_val.replace(' ', '').split('|'); //remove spaces and split with |
            var index = arr.indexOf(val);//get index of value to be deleted
            arr.splice(index, 1); //remove value from array 
            $.cookie(cookie, arr.join(' | ')); //convert array to sting using join and set value to cookie
        }
    }
}

edited Mar 13 '14 at 07:16

answered Mar 13 '14 at 06:47

Tushar Gupta - curioustushar

58,085
24
103
107

nope no error in the console..when i unselect, it does enter the function, but the cookie value remains the same – Wasiim Mar 13 '14 at 07:06
i am able to get an alert in : if (cookie_val.indexOf(val) !== -1) { – Wasiim Mar 13 '14 at 07:08
@Wasiim try `alert(arr.join(' | '))` – Tushar Gupta - curioustushar Mar 13 '14 at 07:09
When alerting this, it seems to work fine.. suppose i add 3 products to me cart, and i unselect one , i get: 9918430821007~12.00 | 7C9918430831006~3.00 – Wasiim Mar 13 '14 at 07:15
But it is not repalcing the value of the cookie – Wasiim Mar 13 '14 at 07:16
@Wasiim oh sorry i just in hurry wrote missed code for setting value .Changed last line to `$.cookie(cookie, arr.join(' | '));` – Tushar Gupta - curioustushar Mar 13 '14 at 07:17
fantastic, it works..but i have one issue now: when i add one product, it is stored as follows:7C9918430821007~12.00 . I unselected the product and add it again, i now get: | 7C9918430821007~12.00 . A "|" before the cookie – Wasiim Mar 13 '14 at 07:24
i got this one, the mistake was in my code in Basket.select().. i just added: || $.cookie(cookie)=="". And this as well was fixed .. – Wasiim Mar 13 '14 at 07:27

How to delete a specific value in a cookie - jquery

1 Answers1