2

A bit of a curve ball request that might well not have a solution, but worth asking...

We have a heavy AJAX-based website and we rely on modal/loading screens fairly heavily to indicate when something important is happening. All works well.

We also have some operations that trigger full page changes which can take a couple seconds. I'd like to impose the same modal/loading screen when those changes kick off, however- if a user cancels the page load I'd like to detect it and take the loading modal down. Else it'd just sit there forever.

I can watch for the Escape key being used but is there a way to detect the cancellation in a more generic way that'd also work when initiated by the browser's cancel controls?

Thanks

P.S. To be clear, I'm talking normal page changes in this case. Mentioning the AJAX used elsewhere was just to explain why I want the loading screen now; for consistency. Otherwise I think we'd all agree it's abnormal to have loading screens just to navigate around a site.

RESULT

Evidently not possible. As niklas found: But now I see what you're tying to do and i found this https://stackoverflow.com/a/1776490/3877639. I don't like your odds I'm afraid.

Community
  • 1
  • 1
Rikaelus
  • 574
  • 1
  • 5
  • 15

2 Answers2

1

Started answering, then I saw Carlos answer and thought I might have misinterpret your question. I'll leave my first answer in the bottom, just in case it might be of some use to you either way.

You wish to detect the page load being canceled. But if the page load is canceled, won't the ajax call fail? Couldn't you listen for that some how and then take down the modal/loading screen?

Don't know if you use jQuery's .ajax(), but then it's easy doing stuff if there's any errors.

What you are looking for is the onunload event. However, the browser support is not so good (as you can see in the link).

There's also the onbeforeunload event that has better browser support, but it triggers a browser dialog you can't override. Just send a text to. Then the user can choose to stay on the page or leave it/close it.

Niklas
  • 1,729
  • 1
  • 12
  • 19
  • You were close with the first answer, however it's not the page changing I'm trying to detect. It's when that change is *cancelled* by the user. Hence the curve ball. I doubt there's a way besides something roundabout, like using setTimeout to see if the page is still live after a few seconds, then removing the loading overlay. Clearly not an ideal method but might be all there is. – Rikaelus Jul 25 '14 at 22:45
  • Hmm, how can the user cancel the change exactly? Is it the change happening after the ajax call is done, rendering the new HTML if you will, that takes time and the user can cancel? – Niklas Jul 25 '14 at 23:01
  • Heh, bad communication day. By your "first answer" I meant the one at the bottom that you referred to in that way. AJAX isn't involved in this transition. Think of it simply as a link click or a window.location. So normal convention would be that they can cancel it by hitting Escape (which I can catch) or by hitting the browser's X/cancel button (which I don't know how to catch). So I was looking for a way to simply catch ALL unload terminations. – Rikaelus Jul 25 '14 at 23:38
  • 1
    I see, the mentioning of AJAX fooled me. But now I see what you're tying to do and i found this [http://stackoverflow.com/a/1776490/3877639](http://stackoverflow.com/a/1776490/3877639). I don't like your odds I'm afraid... – Niklas Jul 25 '14 at 23:53
  • You're right. Same situation there, and I kind of figured I was barking up a bad tree. Once the unload event is triggered I doubt browsers have much interest communicating with a page it assumes is being left. Ah well. Thanks for taking the time, and for finding that other topic. – Rikaelus Jul 26 '14 at 00:27
0

Basically you can abort the XMLHttpRequest the ajax call returns with jQuery.

See this

Community
  • 1
  • 1
Veglos
  • 458
  • 4
  • 8
  • Sorry, I wasn't clear. Mention of the AJAX was to provide background as to why I want the loading screen now, but the calls I'm dealing with right now are normal page changes (not AJAX) – Rikaelus Jul 25 '14 at 22:40