Disable browser back button once the user get login in JSF pages

Question

I have used tiles in Spring web flow.This is my standard jsf file.

standard.xhtml

      <f:view contentType="text/html">

   <h:head >
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Nagra Employee Leave Application</title>
<link rel="stylesheet" href="${request.contextPath}/styles/blueprint/screen.css" type="text/css" media="screen, projection" />
<link rel="stylesheet" href="${request.contextPath}/styles/blueprint/print.css" type="text/css" media="print" />

<link rel="stylesheet" href="${request.contextPath}/styles/le-frog/jquery-ui-1.8.2.custom.css" type="text/css" media="screen" />
<ui:insert name="headIncludes"/>
<style>

</style>
  </h:head>
   <h:body  style="background:#343433" >
   <div class="container" style="background:white;">


    <a href="#{request.contextPath}"><img src="${request.contextPath}/images/rubon1.jpg" height="200" width="950" alt="Spring Travel"/></a>


<div>
    <div id="local" class="span-4 colborder" style="padding-top: 20px;
    padding-left: 21px;">
        <h3>Nagra Vision</h3>
        <ui:insert name="notes"/>
    </div>
    <div class="span-19 last" style="width: 720px;">
        <ui:insert name="content"/>
    </div>
</div>

<div>
    <a href="http://www.nagra.com">
        <img src="${request.contextPath}/images/nagra_footer.png" alt="Powered by Nagra-India" />
    </a>
</div>
 </div>
 </h:body>

Login.xhtml

 <ui:composition xmlns="http://www.w3.org/1999/xhtml"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:p="http://primefaces.org/ui"
template="/WEB-INF/layouts/standard.xhtml">

<ui:define name="content">
    <h:form style="margin-top:10px;">
        <div>
            <h:outputLabel for="username">Username:    </h:outputLabel>
            <h:inputText id="username" value="#{userInfo.username}">          </h:inputText>
        </div>
        <div>
            <h:outputLabel for="password">Password:    </h:outputLabel>
            <h:inputSecret id="password" value="#{userInfo.password}">
            </h:inputSecret>
        </div>
        <div>

            <h:selectBooleanCheckbox id="leavetype"
                value="#{userInfo.loginperson}">
                <f:selectItems value="#{referenceData.loginPersonOptions}" />
            </h:selectBooleanCheckbox>
            <h:outputLabel for="password">Select you are a manager</h:outputLabel>
        </div>

        <div>
            <p:commandButton id="Signin" action="click" value="Sign In"
                style="margin-left:80px;" />
        </div>
    </h:form>
</ui:define>

mainpage.xhtml

 <ui:composition xmlns="http://www.w3.org/1999/xhtml"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:p="http://primefaces.org/ui"
template="/WEB-INF/layouts/standard.xhtml">
<ui:define name="notes">
    <h:outputLabel for="employee">${loginperson.username}</h:outputLabel>
    <h:form>
    <div>   <h:commandLink value="Sick Leave" action="sickleave" id="sickleave" /></div>
    <div>   <h:commandLink value="Paid off Leave" action="paidleave" id="paidleave" /></div>
    <div>   <h:commandLink value="Logout" action="logout" id="logout" /></div>
    </h:form>



</ui:define>
<ui:define name="content">
     <h2 style="font-size: 16px; font-weight: bold; margin-top: 100px;">Available
        Leave</h2>




    <h:dataTable value="#{leaveavailable}" var="a"
        styleClass="order-table" headerClass="order-table-header"
        rowClasses="order-table-odd-row,order-table-even-row"
        columnClasses="order-table-odd-column,order-table-even-column">
        <h:column>
            <f:facet name="header">
                Sick Leave
            </f:facet>
                #{a.totalSickLeave}
        </h:column>
        <h:column>
            <f:facet name="header">
                Paidoff Leave
            </f:facet>
                #{a.totalPaidoffLeave}
        </h:column>
    </h:dataTable>



</ui:define>

here once the user login in the user will see the mainpage.xhtml.After the user getting into the mainpage,if he press the back button of the browser it takes me to the login page.So I need to disable the back button.I do no where to add the javascript code to disable the browser back button.Whether I have to add in mainpage.xhtml or in standard.xhtml.

What java script i have to add to disable the back button

score 2 · Answer 1 · edited May 23 '17 at 12:27

2

It's not possible to disable the back button - have a look here, it's also probably a bad idea from a user-experience point of view, so no great loss. Trying to do this was listed as the number 1 web design mistake of 1999

edited May 23 '17 at 12:27

Community

1
1

answered Jul 20 '12 at 06:53

codebox

19,927
9
63
81

score 1 · Accepted Answer · answered Jul 20 '12 at 06:54

1

You can't disable the back button. You can, however, remove the current document from the browser history and replace it with your desired document by using window.location.replace. Keep in mind that you need to use AJAX in this case, since replace has to be called from the document you want to replace.

Instead of meddling with JavaScript and trying to mangle the user's browser, why don't you check on the server side whether the user is already logged in and redirect him to your main page?

answered Jul 20 '12 at 06:54

Zeta

103,620
13
194
236

Hi,Can I know how the redirect can be done in spring web flow – bharathi Jul 20 '12 at 07:01
Sorry, I don't know about spring web flow. Maybe you'll find something helpful in the [docs](http://www.springsource.org/documentation), otherwise feel free to ask a new question concerning redirects in swf (don't forget to accept codebox' answer). – Zeta Jul 20 '12 at 07:08

score 0 · Answer 3 · edited May 23 '17 at 12:27

You can try following if fits your case.

Stop caching pages by setting proper http no cache tricks, refer article.
After login its common you will be storing some info in session, since you wont be caching pages when user clicks on back button a fresh request will be sent to server where in processing login page request you can check, if already logged in redirect to some different page.

Hope this helps !!!

sagar Borage · Answer 4 · 2014-12-04T09:04:13.373

Just try this,it works fine for me :)
Disable Back functionality using history.forward

This is another technique to disable the back functionality in any webpage. We can disable the back navigation by adding following code in the webpage. Now the catch here is that you have to add this code in all the pages where you want to avoid user to get back from previous page. For example user follows the navigation page1 -> page2. And you want to stop user from page2 to go back to page1. In this case all following code in page1.

<SCRIPT type="text/javascript">
    window.history.forward();
    function noBack() { window.history.forward(); }
</SCRIPT>
</HEAD>
<BODY onload="noBack();"
onpageshow="if (event.persisted) noBack();" onunload="">

The above code will trigger history.forward event for page1. Thus if user presses Back button on page2, he will be sent to page1. But the history.forward code on page1 pushes the user back to page2. Thus user will not be able to go back from page1. To see online Demo- http://viralpatel.net/blogs/demo/javascript-disable-browser-back-button/

Disable browser back button once the user get login in JSF pages

4 Answers4