Disable the back and forward buttons on browser

Disable the back and forward buttons on browser

  
Hello Everybody,
How can I disable the back and forward buttons on the browser?  Is this possible?  The reason I want to do this is because I do not want to allow the user to go back or forward in my application using the browser buttons.  I want the user to only use the functions that I provide on the application pages.
Thanks in advance.
Frank

Hi Frank,

This is something which I came across in a previous project, I came to know that the "solution" to this problem is rather tricky to do it, hard to maintain and highly error prome... I ended up giving up on the idea. The best solution is for you application to be able to work allowing back and foward. However if you really really want to do it, I created a post about the back button here.

The "tricks" that I found to do this included:
- moving foward the browser history (tryed) 
- JS script to "try" to control it (tryed)
- iframe on the page.. (only read about)

Hope that this helps you out!
Good luck :)

All of the solutions that I found can be overpassed.


Thanks.  I anticipated this to be not easy to implement.  We'll have to think about this one.
Rúben Gonçalves wrote:
Hi Frank,

This is something which I came across in a previous project, I came to know that the "solution" to this problem is rather tricky to do it, hard to maintain and highly error prome... I ended up giving up on the idea. The best solution is for you application to be able to work allowing back and foward. However if you really really want to do it, I created a post about the back button here.

The "tricks" that I found to do this included:
- moving foward the browser history (tryed) 
- JS script to "try" to control it (tryed)
- iframe on the page.. (only read about)

Hope that this helps you out!
Good luck :)

All of the solutions that I found can be overpassed.

 
 
Here's the correct link:
http://www.outsystems.com/NetworkForums/ViewTopic.aspx?TopicId=8206&Topic=How-to%3a-disable-back-button%3f#Post25677

Regards.

Daniel Martins.
 
The short anwser is: you can't.

The long answer is, short of writing your own browser, you can't, and even then, you can't.

Even if you find a work around that works in, say, Internet Explorer, can you prevent users from using Firefox or Chrome or Opera or Safari? Will your workaround work in all of them?

Also, you can't prevent users from "leaving" the site when the power fails, or the browser crashes, or the user forgot to close the page and left for lunch, or something else on the client side causes the browser to fail unexpectedly.

So, back to the short answer: you can't.
Frank wrote:
Hello Everybody,
How can I disable the back and forward buttons on the browser?  Is this possible?  The reason I want to do this is because I do not want to allow the user to go back or forward in my application using the browser buttons.  I want the user to only use the functions that I provide on the application pages.
Thanks in advance.
Frank
 
 
 Hello Frank,

We had a similar requirement and this is what we did and IT WORKS. We tested it in IE, Firefox and Chrome and we hadn't had any issues in the past 6 months. Give it a go and let us know your thoughts.

Cheers,
Raghu Kannan
wrote:
 
 Hello Frank,

We had a similar requirement and this is what we did and IT WORKS. We tested it in IE, Firefox and Chrome and we hadn't had any issues in the past 6 months. Give it a go and let us know your thoughts.

Cheers,
Raghu Kannan
 
 Hi Raghu,

Thanks for sharing your solution!
For the quick look that I gave, you appear to have added more information than needed ("chapter" 3: "Put this code in the header of all your pages"). Am I right? If not, what's the purpose of the this code?

All the best,

Rúben
Hi Ruben,

Yes you are correct. Truly sorry, my mistake. That piece of code is for our floating widget.
Actually you cannot DISABLE the back button of the browser because whatever content is running inside the browser window has no access to browser menu items.
 
However, the same effect can be created using some javascript hacks when the page loads.

Let me know how it goes.

Cheers,
Raghu Kannan

This code just keeps loading the same page - I prefer this
 
"<script type = 'text/javascript' >
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);
window.onload=changeHashOnLoad;
</script> "
Alternate Solution:

This code pushes the page forward. Like when you hit the 'Back' button, the previous page loads and the JS pushes the page as if the user has clicked the forward button
 
"<SCRIPT type='text/javascript'>
window.history.forward();
    function noBack() {window.history.forward(); }
window.onload='noBack()';
window.onpageshow=function(evt){if(evt.persisted)noBack()}
window.onunload=function(){void(0)}
 
</SCRIPT>"
Thank you everyone.  That last posting is what worked for me.
Frank