25

I want to change the user status on click of a Button, so all I am doing is, detecting the current status and changing, if needed.

But in this case the changes the status in backend, but to show the status the page needs to be refreshed, as on refresh it checks the current status and shows. So I am using the "window.location.reload" property to show the latest status on page

All the things are working fine in IE. But in case of Firefox and Chrome, The status is not changing. I think "window.location.reload" is not working, because when I just comment this line and try clicking the button and manually refresh the page it shows the changes Status.

Can you please suggest what should I use to make this work in Firefox and Chrome?

When I googled, I found somewhere it works in Firefox and Chrome if you give it in "setTimeout()". I tried it, but even then its not working for me.

<script>

    $(document.body).on('click', '#activate', function () {
        var pkgVersion = $(this).attr('data-version');
        alert("@Url.Action("SetActivePackage", "Deployment")", { version: pkgVersion });
        $.get("@Url.Action("SetActivePackage", "Deployment")", { version: pkgVersion }).done(function () {

        });
         setTimeout(function () { window.location.reload(data); }, 0);
    });
</script>

Please suggest!

Jason Benson
  • 3,371
  • 1
  • 19
  • 21
UID
  • 4,434
  • 11
  • 45
  • 75
  • 2
    `$.get(stuff).done(window.location.reload);` – adeneo Sep 23 '13 at 19:49
  • Also, try `window.location.reload(true)`, but not inside a timeout like that, but in the success handler for the ajax call. – adeneo Sep 23 '13 at 19:50
  • setTimeout( location.reload.bind(location) , 0); ? – dandavis Sep 23 '13 at 20:08
  • thanks for looking into, I tried both options but no luck :-(, Also I modified a little my code. its now "window.location.reload(data); " in the end but the same issue its not reloading automatically – UID Sep 23 '13 at 21:33
  • The `reload` boolean parameter in `location.reload(true)` is simply unuseful: [in MDN](https://developer.mozilla.org/en-US/docs/Web/API/Location/reload) the explanation – bubbakk Feb 09 '22 at 08:09
  • The problem is almost certainly due to browser caching of the page, not failure of location.reload. The solutions prevent caching at reload time: (1) use $.post if feasible, accessing the page with a POST request. (2) "Cache busting", e.g. add a query string, which will prevent caching, such as '?' + Date.now(), or use response headers on the server to prevent caching. – Cris P Mar 23 '23 at 18:20

9 Answers9

40

I had this problem in AngularJS and in Firefox. (Reloading was fine in Chrome). By using setTimeout problem solved.

setTimeout(function(){
  window.location.reload();
});
Morteza
  • 2,097
  • 5
  • 28
  • 47
  • 3
    Or simply: `setTimeout(location.reload)` – wintercounter Dec 16 '15 at 14:04
  • 1
    The original solution worked for me. Using a regular location.reload() worked in everything but Firefox, so I am glad that you posted this. – Adam West May 10 '16 at 20:23
  • 3
    Almost worked for me. In Firefox 50.1.0 (Ubuntu 16.04), this answer as-is does nothing. However changing it to a lambda expression did the trick: `setTimeout(() => window.location.reload());`. –  Jan 02 '17 at 13:05
  • But why though? Why does it need to be within a timeout? – CularBytes Feb 08 '22 at 09:13
39

I have two other options to you:

history.go(0);

And:

window.location.href = window.location.href;

I'm not tested it on Firefox and Chrome yet, but it may help you faster. Tomorrow I'll do the tests and update the answer if this not work.

g4ost
  • 100
  • 8
Wellington Zanelli
  • 1,894
  • 3
  • 18
  • 43
  • 2
    thanks for looking into, I tried both options but no luck :-(, Also I modified a little my code. its now "window.location.reload(data); " in the end but the same issue its not reloading automatically – UID Sep 23 '13 at 21:30
  • 1
    thanks for creating the Fiddle... really liked the examples... but thankfully my issue resolved but with the help of MVC... Thanks anyways! – UID Sep 24 '13 at 21:39
  • 1
    In Firefox if you have **hash** in your URL you have to remove it. To see how to do that go eg. here: http://stackoverflow.com/questions/5818269/javascript-window-location-href-without-hash – actimel Jul 15 '14 at 19:13
  • 1
    The second option works for me in Chrome, FF, Safari, and Safari Mobile. – richardtallent Jan 01 '15 at 16:52
  • 1
    thank you.... have been searching for an hour! history.go worked... – Caner Oct 03 '19 at 15:57
  • this answer is helpful if you find reload like a hit enter in addressbar. – Piyatorn Boss Oct 14 '21 at 16:54
12

Have you tried this?:

window.location = window.location;

Apparently you can drop the "window.", but haven't tried it myself.

Shylo Hana
  • 1,792
  • 13
  • 10
  • what is this supposed to do? – A. Wolff Sep 23 '13 at 19:50
  • 3
    It would reload the page without POST data, while a reload() will keep the POST data, that's the only difference as far as I know ? – adeneo Sep 23 '13 at 19:51
  • thanks for looking into, I tried both options but no luck :-(, Also I modified a little my code. its now "window.location.reload(data); " in the end but the same issue its not reloading automatically – UID Sep 23 '13 at 21:30
2

I had the same issue in Chrome and Firefox. I was able to alleviate the issue by having the server respond with the url of the page. For your case you could have the response be the new value for the user status. Here are two examples: 

$.post('?action=' + myAction, function (data) {
        window.location.href = data;
    });

..and the server response

Response.Write("/yourUrl);
Response.End();

This eliminated the inconsistency in Chrome and the page reloads without fail.

Michael
  • 239
  • 3
  • 9
1

Look this You can force the the reload to get the page from server by setting the forceGet parameter to true: 

location.reload(true);
Volodymyr Yasinskyi
  • 148
  • 1
  • 7
1

Here this is working to me with Fire Fox as well as Crome and its working fine with IE.

object.reload(forcedReload);
Dhruv Gurjar
  • 115
  • 13
0

Key note from my perspective is that the location of the function for me had to be above the location in which the call originated. Thinking that browser interprets the javascript from top to bottom, if my code for reload was below the object that invokes it, it fails. If I put the code above it, window.location.href = window.location.href; worked.

Mattei
  • 1
  • 1
  • 1
    When you suggest that 'the function definition has to appear before the function call', note that this is only true for function expressions (var my_function = function(){}), not function declarations (function my_function(){ }). Function declarations are hoisted whereas function expressions are not; so when you say that 'the browser compiles JS from top to bottom' (first of all, browsers interpret JS, they do not compile it) that is not entirely accurate. – Sensei James Sep 09 '16 at 18:35
  • Fair enough, updated to reflect interpret instead of compile, would agree js does not compile. I added the details because it took me a bit to figure out why I could not get the page to reload, and I figured my solution may be significant to others, if they have similar problems. thanks Sensei for the response. – Mattei Sep 23 '16 at 18:57
0

Mega solution I just have found.

You have to simulate to post an empty form.

HTML

<form id="myForm" action='@Url.Action("Details","Main", new { id = @Model.ID } )'></form>

JS

document.getElementById("myForm").submit();
NoWar
  • 36,338
  • 80
  • 323
  • 498
0

I try different answer but the one that works for me is with the argument 'true' that forces the reload

setTimeout(()=>{
  window.location.reload(true);
});
Romain BOBOE
  • 367
  • 3
  • 10