CODEWITHSUNDEEP
javascriptjqueryeventsload
Rikaelus
Rikaelus

Reputation: 627

jQuery / Javascript event to detect page change cancellation

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.

Upvotes: 2

Views: 1273

Answers (2)

Niklas
Niklas

Reputation: 1777

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.

Upvotes: 1

Veglos
Veglos

Reputation: 506

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

See this

Upvotes: 0

Related Questions