Monday, January 29, 2007

No more back button

Browser back button is a very common problem child in many web systems. Ours is no different. A simple search turned out so many different ways to tackle this problem. Some selected simple options are explained below. The thing to keep in mind here is that a determined user can still get around the solutions pretty easily. So while being simple these methods do not provide a 100% gurantee.

Almost all of this methods tackle the problem by disabling or nullifying the effect of the back button by some hack.

1. Disable browser cache - This will make the browser send a response to the server to each back button request.  Found the IE way of doing it using ASP.Net page directive 'output cache', don't think this works for FF. (http://msdn2.microsoft.com/en-us/library/hdxfb6cy.aspx). Or else you can use the html meta tags to achieve the same thing.

<html>
<head>
  <meta http-equiv="Expires" content="0">
  <meta http-equiv="Cache-Control" content="no-cache">
  <meta http-equiv="Pragma" content="no-cache">
</head>

2. Disable the user returning to the previous page by always making the browser history increment by one whenever a page load. (So the previous page = current page) using the javascript windows.history.forward(1) execute in each page you don't want to add to history.

<script language="javascript" type="text/javascript">
          window.history.forward(1);
</script>

This should be added to the head of the page so that it gets executed each time the page loads. Do not perform the first option of disabling the cache if u go for this option as it makes IE confuse. This is the one which worked for me.

3. Invoke a new page using location.replace.

<a href="next.aspx" onclick="javascript:location.replace(this.href);  event.returnValue=false; event.cancelBubble=true;">
Click here to visit the next page without adding the current page to the history folder.
</a>

This will prevent the browser from adding the initial page to the history when u r navigating between pages. But if u want this to work with the postbacks then u have to use this along side window.history.forward method.

Post a Comment