0

I have an age verification pop up that installs a cookie in order to remember user's action for a certain period of time. I have done this following other post here at stack overflow, but I have some doubts.

css

#popup {
  z-index: 1000;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  position: fixed;
  display: none;
  background-color: rgba(0, 0, 0, 0.8);
}

JS using Cookies (doesn't work)

$(function() {

  //Check it the user has been accpeted the agreement
  if (!(document.cookie && document.cookie == "accepted")) {
    $("#popup").show();
  }

  $('[data-popup-close]').on('click', function(e) {
    var targeted_popup_class = jQuery(this).attr('data-popup-close');
    $('[data-popup="' + targeted_popup_class + '"]').fadeOut(350);

    //Set a cookie to remember the state
    document.cookie = "accepted";

    e.preventDefault();
  });

});

JS using local storage

$(function() {

  //Check it the user has been accpeted the agreement
  if (!localStorage.getItem('accepted')) {
    $("#popup").show();
  }

  $('[data-popup-close]').on('click', function(e) {
    var targeted_popup_class = jQuery(this).attr('data-popup-close');
    $('[data-popup="' + targeted_popup_class + '"]').fadeOut(350);

    //Set a cookie to remember the state
    localStorage.setItem('accepted', true);

    e.preventDefault();
  });
});

My first question is why using Cookies does not work?

And the second one is that I would like to have the cookie for a certain period of time as mentioned above. Now with the localStorage method just show the popup once and if I accept and refresh the page is not showing the pop-up anymore but I guess that won't show it for ever. I have tried using this inside the function to control for how long the cookie will be active.

$.cookie('accepted','yes', {expires: 7, path: '/'});

I guess that '7' means 7 days, but if put '0' it does the same. Is it posible to just have the cookie for one hour in order to see if it is working right?

Many thanks as usual for your help.

Br

tanaan
  • 85
  • 1
  • 1
  • 10
  • Possible duplicate of [How do I create and read a value from cookie?](https://stackoverflow.com/questions/4825683/how-do-i-create-and-read-a-value-from-cookie) – Taplar Nov 07 '18 at 20:11

1 Answers1

2

Days is just a number being multiplied to seconds later in the plugin. If you want the cookie to be stored for 1 hour, then you can try

$.cookie('accepted','yes', {expires: 1/24, path: '/'});

You may try the following code

$(function() {

  //Check it the user has been accepted the agreement
  if (!$.cookie('accepted')) {
    $("#popup").show();
  }

  $('[data-popup-close]').on('click', function(e) {
    var targeted_popup_class = $(this).attr('data-popup-close');
    $('[data-popup="' + targeted_popup_class + '"]').fadeOut(350);

    //Set a cookie to remember the state
    $.cookie('accepted','yes', {expires: 1/24, path: '/'});
    e.preventDefault();
  });

});
Ravi Rajendra
  • 688
  • 4
  • 11
  • Hi @Ravi Rajendra, many thanks for your comment. I have tried but it is not working I'm afraid. Pop-up isn't showing one hour after. I have that line just right after `localStorage.setItem('accepted', true);`is that correct? I also have tried `$.cookie('accepted','yes', {expires: 1/1440, path: '/'});` to have the cookie stored for 1 munute and see if it works but no luck. Any clue what I'm doing wrong? Many thanks again – tanaan Nov 07 '18 at 21:42
  • Can you try the code in the edit and let me know? Also ensure no errors in the console. – Ravi Rajendra Nov 07 '18 at 21:56
  • Thanks Ravi, I've tried but pop-up shows up every time I refresh. Using cookie does not work but not sure why. – tanaan Nov 07 '18 at 22:06
  • Ok, this is weird. I have created a fiddle [http://jsfiddle.net/tanaan/Lbohu9q0/3/] and it works good but not sure why not locally. – tanaan Nov 07 '18 at 22:20
  • I've uploaded all files and now everything works fine. It doesn't locally, and not sure why. Many thanks for your help! – tanaan Nov 07 '18 at 22:58
  • @tanaan I think you are not using local server like apache to run. Start using brackets along with nodejs. If you are directly running files like "file:\\..." in the browser then cookie cannot be set. Let me know if you fixed it locally. – Ravi Rajendra Nov 08 '18 at 07:26