Refresh the current page when i click the browser back button(chrome) - javascript

I want to refresh the current page when clicking browser back button, it refreshes the same page but the page is refreshed even when I click logout button in the same page. Please give me valuable solution. Thanks in advance
window.addEventListener('popstate', function (event) {
if (window.event) {
location.reload(true);
}
}

Friend you can not play with the browser function to go back. But you can add in the function of close session the following code
location.reload();
You can also place an event that triggers the same function that will reload the page
And if you want to redirect to another url you can use the following code
window.location.replace("http//:URL.COM");

Related

php - prevent back button

This is a part of my payment.php code.
$f=1 when the values got stored in database correctly.
if($f==1){
echo "<script>alert('Rooms Successfully Reserved')</script>";
echo "<script>window.location.replace('home.php')</script>";
}
Now we all know window.location.replace() replaces the current page, removing the previous one from the back button history.
But the back button is working.
I do not want the user to press the back button and enter the payment.php again.
So, what should i do with it?
Same goes for my login.php page, it redirects to home.php but again one can press back button and get to login.php.
How should i prevent it?
I even tried this:
window.history.forward()
But even it isn't working.
Please help
I think you can work with the Unload Event and the History Function.
<script type="text/javascript">
function back() {
window.history.forward();
}
// Force Client to forward to last (current) Page.
setTimeout("back()", 0);
window.onunload = function () { null };
</script>
Add this before your Body Tag gets closed.

Prevent browser back button navigation without page focus or touch

Without clicking/touching on anywhere inside page when click browser back button, navigation should be disable.
Below implementation only work when click inside page.
history.pushState(null, null, window.location.href);
history.back();
window.onpopstate = () =>{ // not getting activate without clicking inside page
console.warn('DISABLE BROWSER NAVIGATION');
history.forward();
}
one of the best way is to open your application in a popup without controls but again depending upon your requirement this may not be applicable. Hope this helps. Something like below
function openPopup(){
var pathname = (window.location.pathname);
window.open(pathname+'openpagePopup.html','','width=800,height=450,toolbar=no, menubar=no,scrollbars=no,resizable=no,dependent,screenx=80,screeny=80,left=80,top=20,scrollbars=no');
return false;
}
The otherways are not trustworthy like you can show user an alert, but can not disable the back button, as per my knowledge. If you do the below make sure you check browser compatibility.
window.onbeforeunload = function() {
return "Write something here";
};
Update : I found there is a way to handle the page history. Incase that works, I have never tried, here is a link
JS - window.history - Delete a state

Load back to homepage on refresh

I have a single page website. If click one of the navbar tabs, lets say 'contact us' the site will scroll down to the contact section. The problem is, if I refresh the site now it will automatically scroll down to the contact section each time. I want the site to scroll to the top of the page every time I refresh. The reason this is happening is because the address bar is changed to ...index.html#contact-area.
I tried the code below but the site gets caught in an infinite refresh loop.
<script>
window.location.replace("index.html");
</script>
I also tried the following but it doesn't work. It starts to scroll up then stops.
<script>
window.onbeforeunload = function () {
window.scrollTo(0, 0);
}
</script>
One option is to attach an event listener to the anchor instead, and instead of changing the page hash, call scrollIntoView on the #contact-area:
anchor.addEventListener('e', (e) => {
e.preventDefault(); // don't change page hash (unless JS disabled...)
document.querySelector('#contact-area').scrollIntoView();
});

call php function when browser back button clicked

How can I call a PHP Function when Browser Back button clicked or right click then clicked BACK item then prevent page to redirect to login page when user is still logged-in.
I found this (Pressing back button redirects the logged user to log out?) to prevent page to redirect to other page when user clicked browser back button and user is still logged in, but I didn't know where to put those codes and how to call that function.
Can someone explain this thoroughly to accomplish my problem or provide some DEMO(JSFiddle) for better understanding?
You could use a header redirect on the login page to check if the user is logged in, but this will have to be called before any page data is sent:
if(isset($_SESSION['username'])){
header("Location: home.php");
}
You can try to use this:
jQuery(document).ready(function($) {
if (window.history && window.history.pushState) {
window.history.pushState('forward', null, './#forward');
$(window).on('popstate', function() {
alert('Back button was pressed.'); //here you know that the back button is pressed
});
}
});
You can find the answer Here
What this does, it checks with JS if the back button was pushed and if so, you can perform whatever action you want. If a redirect is what you need, use window.location = "http://www.yoururl.com"; OR window.navigate("http://www.yoururl.com"); //works only with IE
Alternatively, you can place an jquery ajax call there, that sends posted requests back to a certain page, and you can check them like:
if(isset($_POST['ajax_response_from_js_script']) {
//call PHP function
}
Hope it helps!
Keep on coding!
Ares.

How to stay fancy box popup sometime after click on the browser back button

I want to show a popup when user click on the close button or back button in browser in checkout page of my site. I have implemented the following code for that ........
function PopIt() {
$("a#trigger").trigger('click');
window.onbeforeunload = UnPopIt;
return "Would you like to join our mailing list for other offers?";
}
function UnPopIt() { /* nothing to return */ }
$(document).ready(function() {
//window.history.forward();
window.onbeforeunload = PopIt;
$("a#trigger").fancybox({
'hideOnContentClick': false,
'hideOnOverlayClick': false,
'showCloseButton': true
});
$("a[id!=trigger]").click(function(){ window.onbeforeunload = UnPopIt; });
});
Now everything is working fine. But the final requirement is when user click on the back browser button from the checkout page, the fancy box popup appear and it will stay ~40 seconds then the page redirect to back.
I can't solve this problem. How do I stay the popup when already the page redirecting to click on the back button on browser. Is it possible? Please help me
Have you tried (#user1721135)
Jquery when back button is pressed
I understand is a different event but maybe can help :S.... Also: (#IMRAN ABDUL GHANI) Solution to browser back button click event handling

Categories

Resources