JavaScript : Creating Cookies
Creating Cookies
We have already learned the various parts of the cookie like name, value, expires, path, domain and security. Lets create a simple cookie.
In the following example we have written a function name 'CookieSet' and set some of its attributes.
Example : Creating Cookies
In the following web document four parameters name, value, expires and path parts sent to the function 'CookieSet'. The secure and domain parts are not essential here. Empty values set to expires and path parts and there is a checking for expires and path parts. If expires receive empty value it will set the expires date 9 months from current date and if path receive empty value then current directory and subdirectories will be the path. The toUTCString converts the date to a string, using the universal time convention.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
<title>JavaScript creating cookies - example1</title>
</head>
<body>
<h1 style="color: red">JavaScript creating cookies - example1</h1>
<hr />
<script type="text/javascript">
//This is done to make the following JavaScript code compatible to XHTML. <![CDATA[
function CookieSet (cName, cValue, cPath, cExpires)
{
cvalue = encodeURIComponent(cValue);
if (cExpires == "")
{
var cdate = new Date();
cdate.setMonth(cdate.getMonth() + 9);
cExpires = cdate.toUTCString();
}
if (cPath != "")
{
cPath = ";Path=" + cPath;
}
document.cookie = cName + "=" + cValue +"expires=" + cExpires + cPath;
}
CookieSet("Name","George ","","");
alert(document.cookie)
//]]>
</script>
</body>
</html>
View the example in the browser
Example : Receive real data from the user and store it in a cookie.
The following web document receives real data from the user and store it in a cookie for next one year from the current date.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> <meta http-equiv="content-type" content="text/html; charset=iso-8859-1" /> <title>JavaScript creating cookies - receive real data. example1</title> </head> <body> <h1 style="color: red">JavaScript creating cookies, receive real data. - example1</h1>
<hr /> <script type="text/javascript"> //This is done to make the following JavaScript code compatible to XHTML. <![CDATA[ var visitor_name = prompt("What's your name?",""); var expr_date = new Date("December 30, 2012"); var cookie_date = expr_date.toUTCString(); final_cookie = "Name =" + encodeURIComponent(visitor_name) + ";expires_on = " + cookie_date; document.cookie = final_cookie; alert(final_cookie); //]]> </script> </body> </html>
View the example in the browser
Delete a cookie
Deleting a cookie is extremely easy. To delete a cookie first accept the name of the cookie and create a cookie with the same name and set expiry date one day ago from the current date. As the expiry date has already passed the browser removes the cookie immediately. It is not confirm that the cookie has deleted during the current session, some browser maintain the cookie until restart the browser. To see the example read A real example on Cookies page.
