Javascript: Cookie can not be read in all the HTML pages - javascript

I copied and used getCookie and setCookie from W3Schools(http://www.w3schools.com/js/js_cookies.asp). Here are the codes of get and set:
function setCookie(c_name,value,exdays)
{
var exdate=new Date();
exdate.setDate(exdate.getDate() + exdays);
var c_value=escape(value) + ((exdays==null) ? "" : "; expires="+exdate.toUTCString());
document.cookie=c_name + "=" + c_value;
}
function getCookie(c_name)
{
var c_value = document.cookie;
var c_start = c_value.indexOf(" " + c_name + "=");
if (c_start == -1)
{
c_start = c_value.indexOf(c_name + "=");
}
if (c_start == -1)
{
c_value = null;
}
else
{
c_start = c_value.indexOf("=", c_start) + 1;
var c_end = c_value.indexOf(";", c_start);
if (c_end == -1)
{
c_end = c_value.length;
}
c_value = unescape(c_value.substring(c_start,c_end));
}
return c_value;
}
I frist set cookie in prepareDrive.html page
setCookie("pathName",path,365);
setCookie("formatName",ifFormat,365);
Then I called get cookie in startInstall.html page which is a different HTML page
var path = getCookie("pathName");
var ifFormat = getCookie("formatName");
but both path and ifFormat are null. However, when I console.log in prepareDrive.html, the data is there. Thanks !!! This is my first time to use cookie in JS. I do not want to use localstorage to store data.Because some old version browsers do not support this function ,right?

You need to specify a common path for the cookie. Simplest is just to specify the domain root:
var c_value=escape(value) + "; path=/" + ((exdays==null) ? "" : "; expires="+exdate.toUTCString());
Without that, document.cookie will default to the current location.pathname, making the cookie only available to the current page.
;path=path (e.g., '/', '/mydir') If not specified, defaults to the current path of the current document location.
Also, I suggest having a look at the "little framework" for cookies on MDN.

If you are already using jquery you might want to consider the jquery plugin:
https://github.com/jquery/plugins.jquery.com
That makes it pretty straightforward.

Related

How to detect invalid Js cookie and remove it

I have set a cookie1 from [.abcsite.com]. when no domain mentioned from API it sets a cookie1 by default to [www.abcsite.com]. Now, the cookie1 gets duplicated, it creates issues in updating the value. How to delete cookie1 with [www.abcsite.com] domain only when cookie1 [.abcsite.com] domain is present as well.
function setCookie(c_name, value, expiredays) {
var date = new Date();
date.setDate(date.getDate() + expiredays);
document.cookie = c_name + "=" + escape(value) + ";expires="+date.toGMTString() + ";path=/";
}
You can use this function to set a cookie and remove by :
setCookie(name, "", -1);
and the way to read cookie by:
function getCookie(c_name) {
if (document.cookie.length > 0) {
c_start = document.cookie.indexOf(c_name + "=")
if (c_start != -1){
c_start = c_start + c_name.length + 1
c_end = document.cookie.indexOf(";", c_start)
if (c_end == -1)
c_end = document.cookie.length
return unescape(document.cookie.substring(c_start, c_end))
}
}
return ""
}

Increment browser cookie in Javascript? (setCookie, getCookie method)

Logically this seems to be correct. However, either the setCookie or getCookie functions simply aren't firing?
cookie.js
function setCookie(c_name,value,exdays) { var exdate=new Date();
exdate.setDate(exdate.getDate() + exdays); var c_value=escape(value) +
((exdays==null) ? "" : "; expires="+exdate.toUTCString());
document.cookie=c_name + "=" + c_value; }
function getCookie(c_name)
{
var c_value = document.cookie;
var c_start = c_value.indexOf(" " + c_name + "=");
if (c_start == -1)
{
c_start = c_value.indexOf(c_name + "=");
}
if (c_start == -1)
{
c_value = null;
}
else
{
c_start = c_value.indexOf("=", c_start) + 1;
var c_end = c_value.indexOf(";", c_start);
if (c_end == -1)
{
c_end = c_value.length;
}
c_value = unescape(c_value.substring(c_start,c_end));
}
return c_value;
}
index.php
var newCookie = parseInt(getCookie("liked_count"));
if(newCookie != null && newCookie != ""){
newCookie += 1;
setCookie("liked_count",newCookie,5);
}else{
setCookie("liked_count",1,5);
}
No matter which side of the if statement it follows, no cookie is set regardless. From what I can tell there are no errors or warnings, so could it be that it cannot find the setCookie and getCookie function inside the my cookies.js file?
The cookies.js file successfully locates, so I'm at my wits end here.
<head>
<script type="text/javascript" src="assets/js/cookies.js"></script>
</head>
Any help would be much appreciated!
EDIT:
Oh sorry, this is embarrassing... It turns out that the cookie.js file was being cached and I had actually moved file location. It was that simple. Sorry for this waste of time!
The problem you're having is with your use of:
var newCookie = parseInt(getCookie("liked_count"));
MDN parseInt Documentation
parseInt returns NaN if it fails. Instead of the following line:
if(newCookie != null && newCookie != ""){
you should have
if(!isNaN(newCookie)) {
http://plnkr.co/edit/2Nj5pj

save javascript cookies site basis, not aspx page wise

I want to save cookie one and I want to keep updating it on a site basis, not page wise.
Currently I have 5 headers in my navigation box which is static to all pages and on click of header; I am saving header text to the cookie and on every page selected header retrieving.
But the problem is that the cookie is saving page wise not site wise. Each page is creating a new cookie.
Code below,
function setCookie(c_name,value,expdays)
{
var exdate=new Date();
exdate.setDate(exdate.getDate() + expdays);
var c_value=escape(value) + ((expdays==null) ? "" : "; expires="+exdate.toUTCString());
document.cookie=c_name + "=" + c_value;
}
function getCookie(c_name)
{
var c_value = document.cookie;
var c_start = c_value.indexOf(" " + c_name + "=");
if (c_start == -1)
{
c_start = c_value.indexOf(c_name + "=");
}
if (c_start == -1)
{
c_value = null;
}
else
{
c_start = c_value.indexOf("=", c_start) + 1;
var c_end = c_value.indexOf(";", c_start);
if (c_end == -1)
{
c_end = c_value.length;
}
c_value = unescape(c_value.substring(c_start,c_end));
}
return c_value;
}
$(function($) {
var menuClickedOld1 = getCookie("SPLeftNavigation");
if(menuClickedOld1!=null && menuClickedOld1!=""){
$('li:contains('+menuClickedOld1+') ul').show();
alert("from cookie "+menuClickedOld1);
}
else{
alert('No values');
}
$('.arrw').click(function() {
var lname=$(this).parent().text();// selected header name;
setCookie("SPLeftNavigation",lnName,1);
});
});
How can I resolve this problem I already spent a day on it... as it's for production.
Thanks!!
haha this is really interesting.
Actually cookies are stored page wise by default and if you want to save it on a specific site or domain use it as below :
'SPCookie=myheader; expires=Sat, 7 Sept 2013 20:47:11 UTC; path=/'
Done !

Set browser cookie one day

I successfully create a webpage with a Age Confirmation Block Popup. I code like popup appears once per user, appears a single time for everyone. But i want to make as like it appears 1 time each day. Cookie with reset per 24 hour.
Can anyone please suggest any idea to how to do it.
Thanks in advance.
<a onClick="document.getElementById('ac-wrapper').style.display='none'; setCookie('abc', 'def', 365)" href="#" style="text-decoration: none;">OK</a>
<script type="text/javascript">
function setCookie(c_name,value,exdays)
{
var exdate=new Date();
exdate.setDate(exdate.getDate() + exdays);
var c_value=escape(value) + ((exdays==null) ? "" : "; expires="+exdate.toUTCString());
document.cookie=c_name + "=" + c_value;
}
function getCookie(c_name)
{
var c_value = document.cookie;
var c_start = c_value.indexOf(" " + c_name + "=");
if (c_start == -1)
{
c_start = c_value.indexOf(c_name + "=");
}
if (c_start == -1)
{
c_value = null;
}
else
{
c_start = c_value.indexOf("=", c_start) + 1;
var c_end = c_value.indexOf(";", c_start);
if (c_end == -1)
{
c_end = c_value.length;
}
c_value = unescape(c_value.substring(c_start,c_end));
}
return c_value;
}
if(getCookie('abc')=="def" && document.getElementById('ac-wrapper'))
document.getElementById('ac-wrapper').style.display='none';
</script>
Change
setCookie('abc', 'def', 365)
to
setCookie('abc', 'def', 1)

Detect Chrome restart from client javascript

How can I detect client-side whether a user has just re-opened chrome with "Continue where I left off" enabled?
I would like modify client-side behavior based upon whether the user has just come from a related page. Re-opening the browser should not activate this behavior, but document.referrer is preserved.
You can use Cookies.
The cookies are stored in the client side and they can be seted and retrived via javascript (if the browser configuration allows it). Here you have examples for setting ang getting cookies with javascript.
function setCookie(c_name,value,exdays)
{
var exdate=new Date();
exdate.setDate(exdate.getDate() + exdays);
var c_value=escape(value) + ((exdays==null) ? "" : "; expires="+exdate.toUTCString());
document.cookie=c_name + "=" + c_value; /* In this line you set the value */
}
function getCookie(c_name)
{
var c_value = document.cookie;
var c_start = c_value.indexOf(" " + c_name + "=");
if (c_start == -1)
{
c_start = c_value.indexOf(c_name + "="); /* In this line you get the key */
}
if (c_start == -1)
{
c_value = null;
}
else
{
c_start = c_value.indexOf("=", c_start) + 1;
var c_end = c_value.indexOf(";", c_start);
if (c_end == -1)
{
c_end = c_value.length;
}
c_value = unescape(c_value.substring(c_start,c_end)); /* In this line you get the value */
}
return c_value;
}
You can get more information here: http://www.w3schools.com/js/js_cookies.asp

Categories