jQuery Cookie glitch

Question

I have an 'Accept Cookies' bar at the foot of my web page using the following HTML:

<div class="cookies-banner-bloc">
            <div class="cookies-banner-container">
                <p>We use cookies on this website.</p>
                <a class="cookies-close-button no-border">Close this Message</a>
            </div>
        </div>

I use the following jQuery to use cookies to store when the user has clicked 'Close', however, the cookie only seems to be stored on the one page and not across the entire site. I do have it in my header.php script so it should be affecting all my templates.

Why is this only working on one page?

Javascript:

<script>
        function getCookie(cname) {
            var name = cname + "=";
            var ca = document.cookie.split(';');
            for(var i = 0; i <ca.length; i++) {
                var c = ca[i];
                while (c.charAt(0)==' ') {
                    c = c.substring(1);
                }
                if (c.indexOf(name) == 0) {
                    return c.substring(name.length,c.length);
                }
            }
            return "";
        }

        jQuery(document).ready(function($){

            if(getCookie("userclosedalert")=="true"){
                  $(".cookies-banner-bloc").addClass('hide');
                  removeClass = false;
            } else {
                  $(".cookies-banner-bloc").addClass('show');
                  removeClass = false;
            }
            $(".cookies-close-button").click(function () {
               document.cookie = "userclosedalert=true";

            });

        });

        </script>

CSS:

.cookies-banner-bloc {
    width: 100%;
    position: fixed;
    bottom: 0;
    background-color: black;
    padding: 25px 0;
    opacity: 1;
    display:none;
}

.cookies-banner-bloc.show {
    display:block;
}

.cookies-banner-bloc.show.hide,.hide {
    display:none;
}

score 1 · Accepted Answer · edited May 23 '17 at 10:29

1

Resolved!

document.cookie = "userclosedalert=true;path=/";

Found this useful post: One Cookie - Multiple Pages

edited May 23 '17 at 10:29

Community

1
1

answered Feb 11 '17 at 12:39

michaelmcgurk

6,367
23
94
190

score 1 · Answer 2 · answered Feb 11 '17 at 12:44

I also do not see when your cookie expires. At the next session, the user will see this message again. You can use something like this

var x = 12 * 20; //or whatever offset
var CurrentDate = new Date();
CurrentDate.setMonth(CurrentDate.getMonth() + x);
document.cookie = "userclosedalert=true; expires=" + CurrentDate + ";path=/";

jQuery Cookie glitch

2 Answers2