I want to store Javascript array as a Cookie

Question

Is it possible, I have a some sort of list and I want to store it on browser, if it is not possible, what is the efficient way of doing this?

Answer 1

For each value id in an array, please try below method to save a value in a cookie array:

<script type="text/javascript">

/**
 * set cookie
 */
function set_cookie(cookiename, cookievalue, hours) {
    var date = new Date();
    date.setTime(date.getTime() + Number(hours) * 3600 * 1000);
    document.cookie = cookiename + "=" + cookievalue + "; path=/;expires = " + date.toGMTString();

}

set_cookie('item['+id+']', id, 24*365*10); // 10 years

</script>

And you can retrieve this array in php:

<?php
foreach($_COOKIE['item'] as $e){
echo $e,'<br />';
}
?>

Answer 2

One quick method is to join() your array into a single string, using an appropriate delimiter:

var a = [1, 2, 3, 4];
a.join('|');  // Returns: "1|2|3|4"

Then simply use the string split() method to get the array back from the cookie string.

Answer 3

JSON encode it, effectively producing a string like "{name:'myname',age:'myage'}" which you put in a cookie, retrieve when needed and decode back into a JavaScript array/object.

Example - store array in a cookie:

var arr = ['foo', 'bar', 'baz'];
var json_str = JSON.stringify(arr);
createCookie('mycookie', json_str);

Later on, to retrieve the cookie's contents as an array:

var json_str = getCookie('mycookie');
var arr = JSON.parse(json_str);

Note: cookie functions are not native, taken from How do I create and read a value from cookie?