Q – Saving and Reading Cookie

@midknyteOct 20.2004

Help needed please. Thank you very much.

I want for my index page at my site to save a value passed in from a partner site link into a cookie.

i.e.
~~[url]~~http://www.mysite.com/index.htm?couponcode=xyz[/url]

So that if the visitor returns to my site at a later date to make a purchase, the “couponcode”, if it exists, is retrieved by my purchase.htm and placed into a form field for them.

This page
~~[url]~~http://www.webreference.com/javascript/961125/part01.html[/url]
got me to understand that it can be done but I do not know how to split the code over the two pages as needed.

to post a comment

JavaScript

5 Comments(s) _↴

@7studOct 21.2004 — #Hi,

1)Get the url and put it into a variable. You can get the full url doing this:

[color="maroon"]var the_url = window.location.href;[/color]

Then you can search the url string for the index position of the question mark(?), which means your couponcode will be immediately after that point. But, there is another property of 'location' that will get you the part after the question mark automatically:

[color="maroon"]var query_string = window.location.search[/color]

'search' is kind of a funny name for that property--it really should be called 'queryString' because the part of the url after the question mark is called a query string(Note: 'search' includes the question mark). In your case,

window.location.href returns: http://www.mysite.com/index.htm?couponcode=xyz

and

window.location.search returns: ?couponcode=xyz

If you know for sure that there will only be one name-value pair in the query string, then the name-value part of the string is simply:

[color="maroon"]var couponCodeString = query_string.substring(1);[/color]

That eliminates the question mark from the string. If it's possible that other name value pairs might also be in the url, like:

[color="maroon"]wwx.mysite.com/index.htm?couponcode=xyz&another_name=abc&one_more=10[/color]

Then you can use the split() function to split up the query string into name-value pairs.

2)After that, you can use the name-value pair to set a cookie, which will allow you to retrieve the information when the user returns. Here are some tutorials on setting and retrieving cookies:

http://www.elated.com/tutorials/programming/javascript/cookies/

http://www.quirksmode.org/js/cookies.html

I would start with the first tutorial. However, when you get to the part about reading cookies it uses regular expressions. If you aren't comfortable with those, then switch over to the second tutorial for reading cookies--it uses substring methods.

@midknyteauthorOct 21.2004 — #To paraphrase Hogans' Heroes, "I know nussssssing! about javascript" ?

I should have mentioned that. But anyhow, I've scribbled in a dozen other languages over the years so here is what I've culled together from your suggestion + some code found on the pages you referenced.

Please let me know if I have correctly coded my parse and save for later [index] page. Thanks.

[COLOR=blue]

<HTML>

<HEAD>

<TITLE>Test</TITLE>

<SCRIPT LANGUAGE = "JavaScript">

function get_CouponCode ()

{

var varpassed = window.location.search;

var varpassed = varpassed.substring(1);

if (varpassed.substring(1, 11) == "couponcode=")

{

var couponcode = varpassed.substring(12);

var expiredays = 90;
  var expdate = new Date ();
  expdate.setTime (expdate.getTime() + (24 * 60 * 60 * 1000 * expiredays));
 
  set_cookie ("couponcode", couponcode, expdate);

}

}

function set_cookie (name, value, expires, path, domain, secure)

{

var cookie_string = name + "=" + escape (value);

if (expires)

cookie_string += "; expires=" + expires.toGMTString();

if (path)

cookie_string += "; path=" + escape (path);

if (domain)

cookie_string += "; domain=" + escape (domain);

if (secure)

cookie_string += "; secure";

document.cookie = cookie_string;

}

</SCRIPT>

</HEAD>

<BODY BGCOLOR="WHITE">

<SCRIPT LANGUAGE = "JavaScript">



</SCRIPT>

<br><br><br><br><center>This is my test page...</center><br>

</BODY>

</HTML>

[/COLOR]

@midknyteauthorOct 21.2004 — #Trying my hand now at adding the complimentary code to the other page to retrieve and display the saved cookie.

Have added to the <head> section of html:

[COLOR=blue]

<SCRIPT LANGUAGE = "JavaScript">

function get_cookie ( cookie_name )

{

var results = document.cookie.match ( cookie_name + '=(.*?)(;|$)' );

if (results)

return ( unescape ( results[1] ) );

else

return null;

}

</SCRIPT>

[/COLOR]

Have added to the <body> section of html:

[COLOR=blue]

<SCRIPT LANGUAGE = "JavaScript">



</SCRIPT>

[/COLOR]

No errors, but no cookie either ?

Returns null. So either the cookie save code is wrong, or the retrieval code is wrong, or both are wrong.

Help please. Thank you.

@midknyteauthorOct 22.2004 — #[SIZE=3]Got it![/SIZE]

Here is the correct, working code for anyone who might benefit.

Code for the <head> block of index page:

[COLOR=red]

<SCRIPT LANGUAGE = "JavaScript">

function get_CouponCode ()

{

var varpassed = window.location.search;

var varpassed = varpassed.substring(1);

if ( varpassed.substring(0, 11) == "couponcode=" )

{

var couponcode = varpassed.substring(11);

var expiredays = 90;
  var expdate = new Date ();
  expdate.setTime ( expdate.getTime() + (expiredays * 24 * 60 * 60 * 1000) );
 
  set_cookie ( "couponcode", couponcode, expdate );

}

}

function set_cookie ( name, value, expires, path, domain, secure )

{

var cookie_string = name + "=" + escape ( value );

if ( expires )

cookie_string += "; expires=" + expires.toGMTString();

if ( path )

cookie_string += "; path=" + escape ( path );

if ( domain )

cookie_string += "; domain=" + escape ( domain );

if ( secure )

cookie_string += "; secure";

document.cookie = cookie_string;

}

</SCRIPT>

[/COLOR]

and the <body> section :

[COLOR=red]

<SCRIPT LANGUAGE = "JavaScript">



</SCRIPT>

[/COLOR]

@midknyteauthorOct 22.2004 — #...and here is the code to retrieve the cookie later and place into the form of the purchase page.

<head> section of html:

[COLOR=red]

<SCRIPT LANGUAGE = "JavaScript">

function get_cookie ( cookie_name )

{

var results = document.cookie.match ( cookie_name + '=(.*?)(;|$)' );

if (results)

return ( unescape ( results[1] ) );

else

return "";

}

</SCRIPT>

[/COLOR]

<body> section of html:

[COLOR=red]

<SCRIPT LANGUAGE = "JavaScript">



</SCRIPT>

[/COLOR]

Also in #JavaScript _↴

Ho to achieve parallax effect on one area only Trying to print from a popup window ActiveX and mouseovers

Success!

Help @midknyte spread the word by sharing this article on Twitter...

Tweet This

Q – Saving and Reading Cookie

5 Comments(s) _↴

Also in #JavaScript _↴

Success!

Social

Version

Q – Saving and Reading Cookie

5 Comments(s) ↴

Also in #JavaScript ↴

Success!

The web is an endless sea of information. Don't miss the boat... Subscribe!

Social

Version

5 Comments(s) _↴

Also in #JavaScript _↴