php - prevent back button - javascript

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.

Related

How to go back to the previous page skipping inner page navigation with href="#id". Using javasctip

I'm new to javascript and web developments. I'm looking for a way of going back to previous page from current page skipping all the inner page navigation.
I know that back funtionality can be implemented by window.history.back(); or window.history.go(-1);
but this will only send me back to the last inner page navigation, if I have done any.
Example
Let's say I have come from www.firstpage.com and currently I'm in www.secondpage.com. And there are links provided by that page to navigate inside that page. Let's say I have navigate through following path.
www.secondpage.com#id1 --> www.secondpage.com#id2
So my current URL is www.secondpage.com#id2, now I want to go back to www.firstpage.com. Back function will only take me to the www.secondpage.com#id1
After some research on internet I realize there is not straight way to do this. So I implemented my own method. When the back option is clicked I called the "goBackContinue" method which continuously call "goBack" in 50mils interval, which call window.history.back();. So it will back the user continuously till he get out of the page. Following is the code
<!DOCTYPE html>
<html>
<body>
<button onclick="goBackContinue()">Go Back</button>
<script>
function goBackContinue(){
var myVar = setInterval(function(){ goBack() }, 50);
}
function goBack() {
window.history.back();
}
</script>
</body>
</html>

Disable button by clicking button

So I was trying to disable a certain button on the entire page and every page onwards by clicking the same button. Meaning the user can only use it once. Now it just doesn't seem to work out :/ I've tried to create a variable and make this variable occur on every single page with $SESSION, and if the variable does not equal to '' it would disable the button, but it doesn't work.. The button is on page A and needs to be disabled on page A when the user reloads the page/submits a form. My code:
My session start:
<?php
session_start();
$hulplijn = $_SESSION['hulplijn'];
$_SESSION['hulplijn'] = $hulplijn;
?>
My button that disables the button once it is clicked:
<script>
function get_accept(input)
{
alert(input);
}
function changeText(el)
{
el.innerHTML = 'Al gebruikt!';
}
</script>
<button onclick="changeText(this); get_accept('<?php echo $hulplijn;?>'); this.disabled='disabled';">Hulplijn</button>
Anyone that can help me out here? Would be much appreciated!
So the thing I wanted to do isn't possible, too bad.. Instead I was better of just allowing users to use the button more than once.

Button change after page reload

So I have a button that I want to control a process. The process can be run/pause/stop.
<div>
<button class="buttonAction" id="run" onclick = "sendData()" >Run</button>
<button class="buttonAction" id="pause" onclick = "sendData1()" >Pause</button>
</div>
So the buttons are in the same position and what I want is when the the run button is clicked the pause button appears and visa versa.
function sendData(){
//some values
window.location.href = '${createLink(controller:'run', action:'run')}' + '?dbvalue=' + db + '&fsvalue=' + fs;
document.getElementById("run").style.visibility="hidden";
document.getElementById("pause").style.visibility="visible";
}
Whats happens is it appears for a second but then reverts back to run because of the page reload window.location.href which I am using to send values back to my controller.
Dos anyone know a way to fix this or a better way of implementing it.
Thanks in advance
Reloading the page is like erasing a whiteboard and starting over again. The next page is not going to remember the state of the JavaScript you run after it. Setting of the buttons needs to take place on the next page load. Ideally your serverside code should be setting the state of the buttons.
Try below code:
function sendData(){
//your implementation
$("#run").css("visibility","hidden");
$("#pause").css("visibility","visible");
}
function sendData1(){
//your implementation
$("#pause").css("visibility","hidden");
$("#run").css("visibility","visible");
}
You will need to use cookies or sessions to keep the changes after a page reload.
By clicking on run, sendData function will be called in that run will be displayed and pause will not displayed, as I kept style.display="none" in the same way if we click on pause, run button will not display as we are using style.display="none"
function sendData(){
document.getElementById("run").style.display="block";
document.getElementById("pause").style.display="none";
}
function sendData1(){
document.getElementById("run").style.display="none";
document.getElementById("pause").style.display="block";
}
So i solved the problem. A few of the answers didnt take into account that the page reloaded.
When the user clicked run I send this back to the controller
window.location.href = '${createLink(controller:'run', action:'run')}' + '?dbvalue=' + db+ '&buttonValue=' + "hideRun"
Then in the controller I took the hideRun and send it back to the page
String button = params.buttonValue
render view:'run.gsp', model:[button:button]
Then I had a a function that gets called on each page load
window.onload = function()
Which checked the value of
"${button}"
Then if it ssaid "hideRun" it would hide the urn button which would display the pause button.
And visa versa...

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.

Disable IE back Button

I have a application where i have disabled the back button of IE8 by using the following code.
window.history.forward();
function noBack() {
window.history.forward();
}
I know this code takes the page back and again moves the page forward. i have called a function onload of the page which makes a textbox read only. i have used the following code to make it read only.
$("#IDofTheTextBox").attr('readonly',true);
but if i select the textbox and try to edit by pressing "BackSpace" button, IE back button is getting invoked and the textbox which was readonly is not readonly anymore. Can anyone help me how to solve this issue?
The answer is simply "NO"
If you're trying to prevent the user from losing their work, try something like:
window.onbeforeunload = function() { return "Are you sure want to leave this page?."; };
function changeHashOnLoad() {
window.location.href += "#";
setTimeout("changeHashAgain()", "50");
}
function changeHashAgain() {
window.location.href += "1";
}
var storedHash = window.location.hash;
window.setInterval(function () {
if (window.location.hash != storedHash) {
window.location.hash = storedHash;
}
}, 50);
You add the above javascript functions in the js file and onload call the function changeHashOnLoad().
its working fine in IE8. i just tested it.
I dont know what your page is trying to do... but this is what we do:
We have an assessment where we do not want the browser buttons enabled... because we run ajax/logic when the user hits next/back etc (to determine what to display next based on their inputs). Back and forward buttons can muddy that process up.
So..... we have users open our assessments in A NEW WINDOW so the back button is already disabled...(there is no prior history in a new window). Then, Our next/back buttons use window.location.replace(url); This will prevent a history item from being created. Therefore, the back/forward buttons are never enabled and they must use the next/prev buttons to navigate our tool.
I would not try to muck with the buttons outside of something like the example I provided.

Categories

Resources