1. Technology

Your suggestion is on its way!

An email with a link to:

http://javascript.about.com/library/blcookie2.htm

was emailed to:

Thanks for sharing About.com with others!

Cookie Toolbox

3. Using the Tools

clr gif
Join the Discussion

Questions? Comments?

More of this Feature

The Script Cookie Functions

Related Resource

Your Favourite Links

On this page I will go into more detail as to how you can use the cookie toolbox to manipulate cookies. In the examples on this page I have included comments to describe what you need to substitute in certain places in the example code or to indicate lines of code that may not be required in certain situations. It is not necessary to include these comments when you code your cookie routines.

First we must define how long our cookies will last for. We define this by adding the number of milliseconds to the current time. Just change the time to keep in the following code to the length of time that you want to keep the cookies for, e.g. 7200000 would be two hours and 31536000000 is one year.

var timeToKeep = 60000; // one minute
var expires = new Date();
expires.setTime(expires.getTime() + timeToKeep);

If the time period is more than a few minutes then it doesn't matter exactly where this code goes as long as it is before we try to create our first cookie. Where the period is shorter we want it as close as possible to being immediately before the create of the cookie or the time may expire before we even write the cookie (in which case it wont get created in the first place).

Next, we need to create our cookie. If we only have one entry to be placed in the cookie (let's call it field_1) then we can create the cookie as follows:

var cookieName = 'myname'; // give the cookie a name
set_cookie(cookieName, field_1, expires);

If you have more than one value to store in cookies (let's call them field_1, field_2, and field_3) then you can still do it in just one cookie by using the following code:

var cookieName = 'myname'; // give the cookie a name
var myarray = init_array();
myarray[1] = field_1;
myarray[2] = field_2;
myarray[3] = field_3;
set_array(cookieName, myarray, expires);

If we want to add another value to the end of an existing cookie we don't even need to know how many values that we already have in the cookie because the following code will work it out for us:

var cookieName = 'myname'; // if it isn't already defined
var myarray = init_array();
// if it isn't already defined
get_array(cookieName, myarray);
var num = next_entry(myarray);
myarray[num] = field_n;
set_array(cookieName, myarray, expires);

I think that about covers creating cookies so now let's move on to retrieving cookies. Let's say that we just want to display the value of the cookie on the screen so I'll include a document.write statement to do that. You just need to substitute the actual code that you want that processed the value(s) retrieved from your cookie. First where the cookie was created using set_cookie we use the following code to retrieve it:

var cookieName = 'myname'; // if it isn't already defined
var field_1 = get_cookie(cookieName);
document.write('<p>field_1 = ' + field_1
continued from previous line + '<\/p>');
// substitute your own processing
del_cookie(cookieName); // if you want to delete
continued from previous line the cookie after reading it

Where we want to retrieve the values from a cookie created using set_array the processing is slightly more complicated and depends on whether we know how many values are stored in the cookie. If we know that we have a specific number of values we can use the following code:

var cookieName = 'myname'; // if it isn't already defined
var myarray = init_array();
// if it isn't already defined
get_array(cookieName, myarray);
var field_1 = myarray[1];
var field_2 = myarray[2];
var field_3 = myarray[3];
document.write('<p>field_1 = ' + field_1
continued from previous line + '<\/p>');
// substitute your own processing
document.write('<p>field_2 = ' + field_2 + '<\/p>');
document.write('<p>field_3 = ' + field_3 + '<\/p>');
del_cookie(cookieName);
// if you want to delete
continued from previous line the cookie after reading it

Alternatively, you could substitute the myarray[n] entries into the subsequent processing and drop the assignments of the array entries - like this:

var cookieName = 'myname'; // if it isn't already defined
var myarray = init_array();
// if it isn't already defined
get_array(cookieName, myarray);
document.write('<p>field_1 = ' + myarray[1] + '<\/p>');
// substitute your own processing
document.write('<p>field_2 = ' + myarray[2] + '<\/p>');
document.write('<p>field_3 = ' + myarray[3] + '<\/p>');
del_cookie(cookieName);
// if you want to delete
continued from previous line the cookie after reading it

Next, we have the situation where we don't know how many values that we have retrieved from the cookie but we still want to process them all. To do this we would change the code as follows:

var cookieName = 'myname'; // if it isn't already defined
var myarray = init_array();
// if it isn't already defined
get_array(cookieName, myarray);
for (var i=1; i<next_entry(myarray); i++) {
document.write('<p>field_' + i + ' = ' + myarray[i]
continued from previous line + '<\/p>');
// substitute your own processing
}

One final situation that I will cover is where we want to delete just one value out of an existing cookie. The code to do this is as follows:

>var cookieName = 'myname'; // if it isn't already defined
var myarray = init_array();
// if it isn't already defined
var pos = 2;
// assign the number of the value within
continued from previous line the cookie that is to be deleted
del_entry(cookieName, myarray, pos, expires);

Note that the cookie toolbox uses special encodings to keep track of multiple values stored in a single cookie. You must store your values using set_array if you intent to be able to retrieve them using get_array.

The Script | Cookie Functions | Using the Tools

Note that the script and the descriptions of the functions that it contains are copied from the "Ask Felgall" website with the permission of the copyright owner.

See More About

©2014 About.com. All rights reserved.