Sunday, March 21, 2010

Cross-Browser Control of the Back Button

Update:  (3/30/2010) We ended up going with an Ajax solution instead.  Although the code below works, it is really annoying in IE, since you see the page redraw twice.

Here is a very brief how-to on forcing a reload of a page when the back button is clicked.  In my current project, I needed to do this because the header portion of the screen contains some status information that could be confusing to our users if the latest updates don't show up.

We're using JBoss Portal server, which is why I put the code in two  different places.

Using JQuery, the JQuery(document).ready function handles this just fine for IE, but not at all for Firefox.  Here is the IE code, which I placed in the header jsp that appears on all portal pages:

<input type="hidden" id="refreshed" value="no">
<script type="text/javascript">
    jQuery(document).ready(function(){
        var e=document.getElementById("refreshed");
        if(e.value=="no")
                e.value="yes";
        else{
            e.value="no";
            location.reload(true);
        }
    });
</script>

To make it work in Firefox, I added an empty "onunload" event in the 1column theme jsp page:
  <body onunload="">

That's it!  It took quite a while for me to track down examples of both of these, so I thought I'd put everything in one place to help out others.