javascriptruby-on-railsruby-on-rails-3extjs4extjs4.2

How can I disable the browser back button with JavaScript, Ruby on Rails?


How to disable the browser back button while navigating in our application. I already try with the following code it prevent only go back option not hide or disable the back navigation icon.

<script type = "text/javascript" >
      history.pushState(null,null);
      window.addEventListener('popstate', function() {
          history.pushState(null,null); });
</script>

And

<script type="text/javascript">

  window.history.forward();

</script>

I want to know at least able to mask that browser back navigation icon/button (it like open new tap in browser that navigation button display as mask mode).


Solution

  • You cannot or better: you should not.

    And if you can, it's an unsecure and unreliable browser.

    Best practice says don't mess with the back button, the USER EXPERIENCE will suffer.

    EDIT:

    You can try to funnel the user by manipulating a session variable on the server-side. Keep a variable like page_number in the session, then set it to 0 on the first page.

    On all subsequent pages check the page_number and force a server-side redirect if the page number is wrong.

    For example, on page 4 you would do this:

    if (session.page_number === 3)
    {
        // ok, user comes from previous page
        session.page_number = 4;
    } else {
        // server-side redirect back to proper page
        // which happens to be "session.page_number"
    }
    

    You put that code on each page (setting higher/lower page numbers) and a back-button click will cause a redirect to the same page you were before.

    Obviously, this is a very bad practice. Funnels should be used only in very limited cases such as for shopping carts and credit card scenarios. A funnel causes a web page to behave more like an ATM. Air flight companies and Amazon use funnels.

    You can find exact details about server-side redirects for ruby on rails on the Internet.