0

I have a scenario where bootstrap modal popup open logic is added to the master page of our application. The modal popup will be triggered when API call sends status message from API server. It works fine when the user has only one instance of application opened in single browser tab. But the problem occurs when user opens multiple browser tabs of different pages in the application. When the API calls sends the status message the Bootstrap modal popup is triggered across all the tabs which is an issue because the user doesn't want to see these popups in all the tabs.

I have tried the below jQuery onfocus, but this doesn't work. I believe I need to attach an eventlistener to the active browser tab but not sure how to proceed. Could someone please help me in how to find out the active browser tab and trigger the bootstrap popup only in the active tab. 

$(window).focus(function(){
  console.log('Trigger popup');
});
Brian Tompsett - 汤莱恩
  • 5,753
  • 72
  • 57
  • 129
user545359
  • 413
  • 5
  • 16
  • 29
  • tested and worked !! http://stackoverflow.com/questions/1060008/is-there-a-way-to-detect-if-a-browser-window-is-not-currently-active – Nalin Aggarwal Aug 26 '16 at 22:11

1 Answers1

0

In your event handler you may use Page Visibility API:

        if (!document.hidden) {
            // do your stuff
        }
gaetanoM
  • 41,594
  • 6
  • 42
  • 61