Disable(Override) browser back button functionality in ADF Application using JavaScript

Sharing is Caring

This is another JavaScript trick to disable browser back button functionality
In this example i am using two jspx pages – Page1 and Page2

 

browser back button

Added two buttons in both pages to navigate between pages

Source of Page1

<af:outputText value="Page 1" id="ot1" inlineStyle="font-size:medium;font-weight:bold;"/>
                <af:commandButton text="Go To Second Page" id="cb1" action="forward"/>

 

Source of Page2-

 <af:outputText value="Page 2" id="ot1" inlineStyle="font-size:medium;font-weight:bold;"/>
                <af:commandButton text="Go To First Page" id="cb1" action="backward"/>

 

Now see JavaScript function to disable back button functionality, In actual JavaScript doesn’t disable back button but override it’s default functionality
This function forces browser to navigate forward instead of going back so on click of back button first browser executes it’s default back operation but due to this function again navigates to forward and show same page

function preventBackButton() {
                  window.history.forward();
              }

Add this javascript to Page 1 and invoke using af:clientListener tag on pageLoad

<af:clientListener method="preventBackButton" type="load"/>

Now run application and check
Go to second page and the press back button – it returns to page one for a fraction of second but again navigates to Page 2
It means it is working , Cheers 🙂 Happy Learning

Related Posts

I’m an Oracle ACE, Blogger, Reviewer,
Technical Lead working on Oracle ADF

0 thoughts on “Disable(Override) browser back button functionality in ADF Application using JavaScript”

  1. Thanks for sharing this, this was helpful n it works
    but if i have any requestScope or viewScope Variables, they will be lost.
    anything can be done to prevent that ?

Leave a Reply

Your email address will not be published. Required fields are marked *