Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to check page is reloading or refreshing using jquery or javascript?

I have to do some kind of operation on the page refresh or reload. that is when I hit next page or Filter or refresh on the grid. I need to show some confirmation box over this Events.

is there any event which can tell you page is doing filer? refresh or paging? using javascript?

Thanks

like image 362
user957178 Avatar asked May 01 '12 15:05

user957178


People also ask

How do you check whether the page is refresh or not in jquery?

On Refresh/Reload/F5: If user will refresh the page, first window. onbeforeunload will fire with IsRefresh value = "Close" and then window. onload will fire with IsRefresh value = "Load", so now you can determine at last that your page is refreshing.

How we can reload the page in jquery?

Answer: Use the JavaScript location. reload() Method You can simply use the JavaScript location. reload() method to refresh or reloads the page. This method optionally accepts a Boolean parameter true or false . If the parameter true is specified, it causes the page to always be reloaded from the server.

How do I check my browser refresh?

Not sure about the back button, but as described in this StackOverflow post, you can use window. onbeforeunload to detect refresh (either F5, CTRL+R or the browser's button).


3 Answers

If it is refreshing, window.onunload will fire.

// From MDN
window.onunload = unloadPage;
function unloadPage()
{
    alert("unload event detected!");
}

https://developer.mozilla.org/en/DOM/window.onunload

If you just want a confirmation box to allow them to stay, use this:

window.onbeforeunload = function() {
    return "Are you sure you want to navigate away?";
}
like image 129
AlienWebguy Avatar answered Oct 10 '22 09:10

AlienWebguy


You can create a hidden field and set its value on first page load. When the page is loaded again, you can check the hidden field. If it's empty then the page is loaded for the first time, else it's refreshed. Some thing like this:

HTML

<body onLoad="CheckPageLoad();">

    <input type="hidden" name="visit" id="visit" value="" />

</body>

JS

function CheckPageLoad() {
    if (document.getElementById("visit").value == "") {
        // This is a fresh page load
        document.getElementById("visit").value = "1";
    }
    else {
        // This is a page refresh
    }
}​
like image 44
palaѕн Avatar answered Oct 10 '22 07:10

palaѕн


There are some clarification notes on wrestling with this I think are critical.

First, the refresh/hidden field system works on the beginning of the new page copy and after, not on leaving the first page copy.

From my research of this method and a few others, there is no way, primarily due to privacy standards, to detect a refresh of a page during unload or earlier. only after the load of the new page and later.

I had a similar issue request, but basically it was terminate session on exit of page, and while looking through that, found that a browser treats a reload/refresh as two distinct pieces:

  1. close the current window (fires onbeforeunload and onunload js events).
  2. request the page as if you never had it. Session on server of course has no issue, but no querystring changes/added values to the page's last used url.

These happen in just that order as well. Only a custom or non standard browser will behave differently.

like image 36
Jason Morello Avatar answered Oct 10 '22 08:10

Jason Morello