I am using window.location.reload in a jQuery dialog on close. The issue is that if users posted to the page earlier, it will give them a dialog to reload the post data. Is there a way to load the page without "reloading", or "refreshing".
Something similiar to PHP's header("Location");
I need it to load the same url, just not reload it.
I understand that I can use window.location = window.location, but this does not work.
How about window.location.href = document.URL;
In addition to the direct answers, looking at this issue from a broader scope might help.
The user is being prompted to reload post data because they came to that page via a POST method - if you were to employ the PRG pattern, you'd avoid the post data prompt, and reap the various other benefits it provides. That said, it is a bit more work :)
Related
I redirect to a new page with javascript as
window.location.href = new_page;
When the new page loaded, I want to run some javascript functions.
However, how can I detect when a page loads, it is from my above redirect?
I consider two options: creating a session or passing variables via the URL as
window.location.href = new_page+'&redirected=1';
Then checking if redirected query is set on each page.
I wonder if there is a simpler or more standard approach to do so?
Passing parameters throught URL works fine, but it's not a pretty good solution. I suggest you to try local storage, with this solution you even could track from and to urls the user has been redirected.
While testing a way in Firefox to reload an HTML page without caching, I've included the following snippet in my code:
<script>
window.setTimeout(function () {
location.reload(false);
}, 5000);
</script>
This reloads the page after 5 seconds, however I get shown the prompt: "To display this page, Firefox must send information that will repeat any action (such as a search or order confirmation) that was performed earlier."
If there a way to do a silent refresh via Javascript, one that doesn't show any prompt? For instance, if I used the refresh Meta tag (HTML), my browser silently refreshes. I want to approximate that same experience, but via JS (and no cache). BTW mine is a Django web app, and I inject the JS code in my Django template.
This is standard behaviour to protect people from submitting form information more than once (eg, prevent double payments in an ecommerce system). Try telling the Javascript to direct to a 'new' page:
Try using this, setting the url to your own;
window.location = "my.url/index.html?nocache=" + (new Date()).getTime();
Answer borrowed from here where there is also an explanation given for why this works -> How can I force window.location to make an HTTP request instead of using the cache?
Have you tried location.reload (true) ? If set to true, it will always reload from server. Set to false it'll look at the cache first.
You are getting this prompt because you ask to reload a POST request. You should always get this prompt when reloading a POST request, as it is not a safe method
However, if you wish, you can explicitely resend a POST request (though you might have difficulties to find back the POST data previously sent). Or explicitely send a GET request to the same URL.
I started looking at HTML5 new history API
However, I have one question. How can one handles the page refresh?
For example a user clicks a link, which is handled by a js function, which
asynchronously loads the content of the page
changes the URL with history.pushState()
The the user refreshes the page, but the URL of course does not exist on the server
How do you handle situations like this? With the hash solution there was no issue there
Thanks
This does require the server-side support. The ideal use of .pushState is to allow URLs from JavaScript applications to be handled intelligently by the server.
This could be either by re-serving the same JavaScript application, and letting it inspect window.location, or by rendering the content at that URL on the server as you would for a normal web application. The specifics obviously vary depending on what you're doing.
You need to perform server side redirection for copy and pasted fake URLs
It all depends on what server side technology you're using. There is no JavaScript way but writing a crazy function in your 404 page that redirect user based on incoming URL that is not a good solution.
The the user refreshes the page, but the URL of course does not exist
on the server
What do you mean by this? I have a feeling your assumption is wrong.
Actually yes, the point is it is the developer who should provide (serverside or clientside) implementation of url-to-pagestate correspondence.
If, once again, I've get the question right.
If you are using ASP.NET MVC on your server, you can add the following to your RegisterRoutes function:
routes.MapRoute(
name: "Default",
url: "{*url}",
defaults: new { controller = "Home", action = "Index" }
);
This will send all requests to Index action of your HomeController and your UI will handle the actual route.
For people looking for a JS-only solution, use the popstate event on window. Please see MDN - popstate for full details, but essentially this event is passed the state object you gave to pushState or replaceState. You can access this object like event.state and use it's data to determine what to do, ie show an AJAX portion of a page.
I'm not sure if this was unavailable in 2011 but this is available in all modern browsers (IE10+), now.
To refresh the page I am using window.location = window.location it works fine with FireFox but not with IE7
any Idea??
Thanx
Call the reload method instead
location.reload(true)
To reload the page, the good solution is to use window.location.reload();
You say this pops up for confirmation? This is probably because the page you are on was called with POST data sent.
If you want thoses POST data to be sent again, you don't have an easy solution to avoid this confirmation (maybe using ajax you could do it.... you'll spend a lot of time doing this).
If you don't want to POST again the data, than you don't want to reload the page ! You only want to load the same URL.
The problem is, if you say to your browser, load this URL, it will do nothing because the URL you're speaking of is already loaded (for most browser, no URL change -> no page reload) !!
An easy way to get around this problem can be to call the same URL plus a random query string value. This way the URL you call is a new one.
To do this a really easy way :
window.location.search += '&' + Math.random();
One problem with this solution is that your URL can become messy....
Depending on your needs and your URLs, you can probably find a way to make very little changes, just enough to make the browser reload the page.
Another simple solution is submitting empty form.. tested it now for IE, FF and Chrome:
function Reload() {
var oForm = document.createElement("form");
document.body.appendChild(oForm);
oForm.submit();
}
This way you can also read the posted data back from the server and submit it again without having the "confirmation" you mentioned, if it's relevant let us know what server side language you're using.
I have an application which works heavily on AJAX. However I want to have navigation functionalities in it. To spoof the url, I am changing the location.hash, to generate URL. But if I use back/fwd, only the url changes, but page wont reload. How can I override the hstory.back to reload the page.
I don't know of any other way than continuous polling to implement this behaviour. An implementation might look like this:
var lastHash = '';
function pollHash() {
if(lastHash !== location.hash) {
lastHash = location.hash;
// hash has changed, so do stuff:
alert(lastHash);
}
}
setInterval(pollHash, 100);
You can't exactly capture the back event, but most of these problems have been solved - and a good thing too, it's a hard problem.
Take a look at really simple history (aka RSH) and either implement it or work through it to see how it works.
The answer for this question will be more or less the same as my answers for these questions:
How to show Ajax requests in URL?
How does Gmail handle back/forward in rich JavaScript?
In summary, two projects that you'll probably want to look at which explain the whole hashchange process and using it with ajax are:
jQuery History (using hashes to manage your pages state and bind to changes to update your page).
jQuery Ajaxy (ajax extension for jQuery History, to allow for complete ajax websites while being completely unobtrusive and gracefully degradable).
The balupton answers are really great.
But you also have another jQuery Plugin to handle your ajax requests, it is address.