Getting an event triggered on a site only ONE time, also after Page Refresh (CTRL+5)

[SlingWing90]

 Hello everyone,

do I need a JS-Code-Snippet to avoid that an event is getting triggered again on a site after I do a site refresh (F5 or CTRL+F5)?

Thanks and Kind Regards

Taras

[Srinivasan]

Hello @SlingWing90,,

I would recommend you to use below JS snippet to stop triggering multiple events on page load,

$("xyz").click(function(event) {
alert("test");
event.stopImmediatePropagation();
});

Hope it helps! Happy Learning!!!

[mvenkatesan]

Hello @SlingWing90,

For trigerring event only once on page then you can use the below example snippet (please replace with your selector) - 

jQuery(selector).one( "click", function() { 
   alert("Clicked"); 
});

I see that you have mentoined even after the page refresh it should not trigger. Assuming that you are looking for that particular session and not browser level.

For Session level, you can achieve using session storage feature - 

jQuery(selector).on('click', function() {

    if (sessionStorage.getItem('count') == null) {
        console.log('Clicked');
        sessionStorage.setItem('count', 1);
    } else {
        console.log('More than once');
    }

});

If you looking for entire browser then you need to use the cookie approach.

Hope this helps, kindly let me know if you need.

Thanks!

[steve_lake]

Hi @SlingWing90 

The suggestions above are great.  You could also set a cookie to say that the event has fired, and then check it on subsequent pages. 

You can use a 'persist data values' extension to do this, and then simply check the 'cp.' cookie in the data layer on a condition on the next event.

Hope that helps.

[SlingWing90]

Hello there,

thanks for your elaborate feedback!

My question now is which extension template I can use for which code?

jQuery(selector).one( "click", function() { 
   alert("Clicked"); 
});

How is this to integrate in an extension?

jQuery(selector).on('click', function() {

    if (sessionStorage.getItem('count') == null) {        console.log('Clicked');        sessionStorage.setItem('count', 1);
    } else {        console.log('More than once');
    }

});

also to find in a way in the extensions templates?

Kind Regards

[mvenkatesan]

Hello @SlingWing90,

You need to add a new custom JavaScript extension and add the below code there.

Note: Please make sure you update the jquery selector for the respective element you want to add this event for.

Hope this helps!