location.reload(), Javascript,HTML

Question

I'm having a problem always when I try to use the following code in a button in my HTML file.

onClick=window.location.reload();
mapGenerator();

The page reloads but the javascript (mapGenerator) that make a D3JS view doesn't appear. What am I doing wrong?

When you reload the page all of the code resets as if you'd never been to the page before. The only way to have it different is to use url parameters or cookies nothing else persist to the newly loaded page — Binvention, Feb 21 '16 at 16:53
@MatíasFidemraizer Well yes some other things persist but nothing you can easily access in your code. Not the kind of thing he's looking for — Binvention, Feb 21 '16 at 16:54
Once you reload the page the rest of the JS in that expression isn't going to run. — Dave Newton, Feb 21 '16 at 16:55
@Binvention orly? :D For example, `localStorage` is hard to use? — Matías Fidemraizer, Feb 21 '16 at 16:58
@MatíasFidemraizer depending on how you're using it. But like I said before it's not the kind of thing he's looking for — Binvention, Feb 21 '16 at 17:00
@Binvention Aren't cookies harder to use than `localStorage`?!! — Matías Fidemraizer, Feb 21 '16 at 17:01
@MatíasFidemraizer Depending on if you have libraries helping you or not. And to be honest I've never dealt with local storage never had a need to yet. — Binvention, Feb 21 '16 at 17:01
@Binvention I believe that it's absolutely irrefutable that `localStorage` is easier to use than cookies..... the fact is you don't need libs to use `localStorage` since it's easy *as is*.......... — Matías Fidemraizer, Feb 21 '16 at 17:04
@MatíasFidemraizer anyway that isn't exactly relevant to his situation is what I was meaning — Binvention, Feb 21 '16 at 17:05

score 2 · Accepted Answer · edited May 23 '17 at 12:15

location.reload() will immediately reload the page and prevent any following code to execute.

You can, however, create a function that executes your method after the page has (re)loaded:

window.onload = function() {
    mapGenerator();
};

This method will run every time the page has fully loaded. To only run the code after you have reloaded the page using location.reload(), you could create a method that handles the click by setting a cookie and then reloading the page.

function handleClick() {
    document.cookie="reload=true";
    location.reload();
}

This would require you to change your onClick value to onClick="handleClick();". Now, whenever the page loads, you can check whether the cookie has been set. Your window.onload function now changes to this:

window.onload = function() {
    if(document.cookie.indexOf("reload") >= 0) {
        mapGenerator();
    }
}

Checking if a cookie exists - answer by Michael Berkowski

After the reload it's up to you whether you want to unset the cookie — if you don't, the page will run the function mapGenerator on every page load until the cookie expires.

If you need more help with cookies, check out W3Schools' tutorial.

Note that the window.onload would have to be in the newly loaded page — Binvention, Feb 21 '16 at 17:00
How do I do that ? because I was using the script only after a button being cliked. — Rafael Bispo, Feb 21 '16 at 17:20
@RafaelBispo add the function to your JavaScript file and it should work. — Indy, Feb 21 '16 at 17:23

score 1 · Answer 2 · answered Feb 21 '16 at 17:07

1

As per your description mentioned above two actions are to be taken on click. As the first action reloads the page the second action is lost. If you want any action to be taken on load of the page, mention the same on onload event of the page.

answered Feb 21 '16 at 17:07

Santosh Kusanale

66
3

location.reload(), Javascript,HTML

2 Answers2

Linked