I have to set the flag (isOpen = 0) when user is leaving the site while clicking the 'Leave' button. Is there a direct way to catch the Leave button click event?
Edited:
We are developing a process flow diagram application. One diagram can access by multiple users in the same group, in that case, if one user open the diagram for edit purpose then system should not allow to edit for another user. So we have set flag isOpen =1 when open the diagram, once closed (customized close button from the page) we set isOpen=0. These scenarios are working fine except user is closing the browser window.
Browser closing scenario:
Please refer the top image. If user close the tab then browser will ask to confirm the action., in that case user
1) User shall leave
2) User shall cancel and stay the page
I cannot set isOpen=0 for window.onbeforeunload() event because if user shall cancel and stay the same page. So we need to catch the Leave/Cancel user actions to set the flag.
Please suggest me an alternate solution if it is not possible to catch leave/cancel user actions.
What you want to achieve is not possible using this logic, the reason is that when a browser tab is closed, all JS execution stops (quite logically since the tab was closed).
Al alternative way to do this is to solve the problem differently. Every couple of seconds (or minutes, depending on your use case) you can send a fetch/ajax request as an "I'm connected" flag. When a user stops sending such a flag it means they closed the tab or it became inactive. If the user reopens it, you will start receiving that user's flag again.
This can be solved more elegantly using WebSockets, which does exactly what I outlined above out of the box. You just need to keep track of your users by their "flag", be it an ID, cookie, etc.
Related
I've searched for hours, but I couldn't find a solution for this.
window.onbeforeunload = warn;
This doesn't work:
function warn (e)
{
var destination = e.href;
alert(destination );
}
Okay, so to clear the things. If the user clicks on a link on the page itself, it is easy, because you can add an eventhandler to all of the links onclick event, but. I want to catch the address, what the user types into the url box of the browser.
Because it can't be done. The new location is private/sensitive information.
Nobody wants you to know which sites they visit when they leave your site.
If you just want to see what link destination, you can use :
document.activeElement.href
But getting the address line destination is not possible.
I've heard of solutions where they fire off an event if the mouse moves up to the address line (to warn the user that there are unfinished processes that have not been dealt with), but this sort of hack I would never do.
Kaze's answer is an interesting approach, but looking at the element focus when the page is navigated away from isn't really reliable. Partly because there is a delay between the link click and the navigation away from the page (during which time the user may move focus to some other element, but also because a link may be focused (eg. by keyboard control, or mousedown-without-click) without actually being used to navigate away from the page. So if you focused a link then closed the window, it'd think you were following the link.
Trapping onclick for every link on the page (plus onsubmit on every form) is slightly more reliable, but can still be fooled due to the delay. For example you click a link, but then before the new page starts loading hit the back button (or press Escape). Again, if you close the window it thinks you're following the link.
I want to catch the address, what the user types into the url box of the browser.
There is no way that will ever happen. It is an obvious privacy no-no.
How can I use javascript or AngularJS to detect the browser or tab closing and allow the user to prevent it through a dialog message?
I have an AngularJS app that saves data to session storage so that the user can refresh the page without losing their state and also have multiple separate instances of the app open in different tabs without having to sync data.
If the user closes the tab or browser then they lose their work in progress because the session is unloaded. I want to detect when the session is being destroyed and show a message to the user that informs them they will lose their work in progress if they proceed and allow them to select OK to continue closing the browser/tab or cancel to stop prevent it from closing. I only want to show the message on browser/tab close, not when the user hits the refresh button or navigates to a new page.
Note 1: I need to use session storage and not local storage because different tabs need to be isolated instances of the app and cannot share data.
Note 2: I've tried the unload and beforeUnload events but these don't work because they also fire when the refresh button is clicked or the user navigates away from the page. I only want to show the message before the session is destroyed, i.e. when the tab/browser is actually closed.
Note 3: This is a corporate app for internal company use and I know all the users and their use cases so I am not worried about annoying them with the popup message. I realize that preventing a user from closing the app would be a bad user experience on a public website but his is a very controlled scenario.
Ideally you could just use the beforeunload event lifecycle.. but as you mentioned you can't. From what I know, there is no other way to bind a method to a similar event.
That said, you might also want to reconsider your first note. You could create a hash for each new session, and store the session stuff under that key in localstorage.
I have site which contains many links. User can open links in new window. User can log out from one window. If they do so and click on the other window of my site then I want to give an alert to the user saying that "Please login to continue". My questions are:-
Is this possible in Drupal 7?
Is there any extra module to support this.
If there is no contributed module available for this then my idea is to register a click event on the page(document) inside JQuery which will always check if user is authenticated or not. I want to know that which function in Drupal will help me in understanding authenticated user of site in JQuery.
Please share if any other option available to achieve this goal.
This is not an easy task, but I am going to explain how I would do so (without too many details):
Create a web service which receives a cookie and returns whether it represents a live session or not.
Use the visibility change javascript event to detect when a user leaves the browser or comes back in. When you notice the user has come back to the browser, perform an AJAX call to the server you set up in step one. You should provide the cookie stored in the browser, and expect a boolean answer.
Depending on the response given by the server, display a modal dialog with Javascript showing a login form orwhatever you consider necessary.
Note: This method will only work if the user is using a browser supporting visibility change events, and can be bypassed disabling Javascript code execution. In addition, the user will still be able to see the content if the browser is not the focused window (for example, there are two opened windows, each of them covering one half of the screen. The event will not fire until the focus comes back to the "forbidden" window).
I want to show a popup when a user close the browser and that popup will redirect to some google survey that we need to do.
Currently by using onbeforeunload function in JavaScript it's prompting me the popup but I only need popup when the user closes the browser or they enter a new url.
Is there any way to prevent this function to not fire when page is refreshed, or user goes back or forward and if it can be done then how will I redirect to a survey page. Or if we can't prevent then there is any logic to do this.
No, this is not possible. These events are outside your control for security reasons.
You're probably best off finding a different solution for your problem.
I am creating an internal web based application that will not be the target audience of the web.
I understand the frustration of alert boxes and forcing people to do certain things.
With that said, what I am attempting to do is create a javascript function, that unless a user clicks a link on a specific page, if they try to navigate away from the page other than using a link on the page, I would like to alert them and say, sorry you need to click the appropriate link to exit.
What my issue is, is that I need to lock out fields, and what I can do when a user hits an edit page, im going to write to a table that user to the lockoutuser colum. If a value exist, that user can access the record if it is null, it means no one is editing the record. If someone clicks to go into that record they lock it out, my means of updating the lockoutuser colum could be ajaxy on unload of the page, but the page could be unloaded for 2 reasons, 1 the edit form is submitted or the user leaves the page.
An alert that would say, sorry you can leave this record without clicking the big red button that says unlock, and force the user without refreshing to stay on the page.
I understand the machine could crash and or an alt f4 or a brute end task on the browser will still leave me other work to unlock the record
You need to use the onunload event of the page to present a messagebox when the user tries to leave your page. Check out this example: http://www.codetoad.com/javascript/miscellaneous/onunload_event_eg.asp