How to display the modal pop up once for a user?

JavaScript
1

I am calling a ‘modal pop’ (#myModal) on ‘window on load’. As expected, its displaying every time when the user navigating from one page to another or during page refresh
and its really annoying. Is there any other way to ‘display pop up only once’ when the user login into the system ?

var currentTime = new Date();
$(document).ready(function() {
	var date = new Date();
	switch (date.getDay()){
	
	case 0: myPlay();
    		break;    
	case 3: myPlay();
			break;
	case 4: myPlay();
	        break;
	case 5: myPlay();
    		break;
	case 6: myPlay();
    		break;
	
	 }
	  
	});
	 
	 
	function myPlay(){
	$(window).on('load', function(){
	        $('#myModal').modal('show');
	    });
	
	var datetime = document.getElementById('myModalLabel');
	datetime.innerHTML = currentTime;              
	               
	}
2

You can use localStorage for that. Once the popup has displayed set a value:

localStorage.setItem('popupShown', 'true');

Then check for it before displaying the popup:

if(!localStorage.getItem('popupShown')) {
  // display popup
}

Further reading: https://developer.mozilla.org/en-US/docs/Web/API/Web_Storage_API/Using_the_Web_Storage_API

1 Like
3

local storage api is the best way to achieve this.

1 Like
4

Hi Pullo

I have tried the localStorage. It will display once when the user login, but once the user logout from the system and login back the pop up will not display again. Only way is clearing the browser cache and try login again, then it will start displaying the pop up. Is this is expected behaviour with localStorage ?

5

Hey,

If you want it to display when the user logs back in, either clear the value from localStorage when they logoout, or use sessionStorgare, which gets cleared when the page session ends.

6

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.