Dear Ivy Team

It seems that Ivy can't handle by default the browser back button if the UI is related to a process. Your proposed solution is to suppress the back button. Imho this is not an acceptable solution especially if everything else reacts correctly to the back button.

I would assume/expect that a Ivy process which is designed with multiple "back paths" should be able to support some kind of a "back button" behavior.

Regards John Moser

asked 18.02.2020 at 09:23

John%20Moser's gravatar image

John Moser
accept rate: 0%

According to your advise here :

we tried to disable the back button. But it turns out that it does not work for Chrome.

Approx. 60% of our users use Chrome. We are getting like 1000 errors per day because users are hitting the back button.

-> Could you provide a solution which works 100% ?

Thanks in advance.

(03.03.2020 at 11:14) John Moser John%20Moser's gravatar image

The hack provided here works like a charm on Chromium:

tested with: Chromium Version 80.0.3987.87 (Official Build) Built on Ubuntu and Axon.ivy 8.0 LTS

<script type = "text/javascript" > history.pushState(null, null, location.href); history.back(); history.forward(); window.onpopstate = function () { history.go(1); }; </script>​

If added this in my main layout xhtml and now the back button is no longer doing any harm in any of my dialogs.


answered 04.03.2020 at 10:41

Reguel%20Wermelinger's gravatar image

Reguel Werme... ♦♦
accept rate: 70%

edited 04.03.2020 at 10:42

SupportIvyTeam's gravatar image

SupportIvyTeam ♦♦

We had to workaround something similar, and ended up adding these lines of JS

window.addEventListener('popstate', function(event) { window.location.replace('#{menuViewOverride.applicationHome}'); }, false); history.pushState({}, null, window.location.pathname);

Where menuViewOverride.applicationHome can be replaced with whatever logic you need to determine the navigation of the previous page.

(22.07.2020 at 05:21) TareqK TareqK's gravatar image

I worked for this issue recently. I could share the idea. We will use "load" and "popstate" event to detect and handle the back button in general and show a custom dialog, you will have full control of the dialog, then you can disable the back button completely.

Refer the load event documentation from Mozilla:

Idea get from an answer on StackOverflow:


var exitPageConfirmDialog = {
  confirmation: undefined,
  enabled: true,
  enable: function() { this.enabled = true; },
  disable: function() { this.enabled = false; },
  show: function() { $('#exitPageConfirmDialog').show(); },
  hide: function() { $('#exitPageConfirmDialog').hide(); },
  showCustomConfirmDialog: function() {
    // creates new history entry with same URL for the first popstate could work
    history.pushState(null, null, null);
    window.addEventListener('popstate', function() {
      if (exitPageConfirmDialog.enabled === true) {
        exitPageConfirmDialog.confirmation = $.Deferred();
            .then(function resolve() {
            }, function reject() {
              history.pushState(null, null, null);
  init: function() {
    $(document).ready(function() {
      // Display custom confirm dialog, when user click on back button.
      window.removeEventListener('load', exitPageConfirmDialog.showCustomConfirmDialog);
      window.addEventListener('load', exitPageConfirmDialog.showCustomConfirmDialog);


<div id="exitPageConfirmDialog" style="display: none; background-color: grey;">
  <p>Do you want to go back?</p>
  <p><button onclick="exitPageConfirmDialog.hide(); exitPageConfirmDialog.confirmation.resolve();">YES</button></p>
  <p><button onclick="exitPageConfirmDialog.hide(); exitPageConfirmDialog.confirmation.reject();">NO</button></p>
< script>
< /script>

You should add onclick in YES/NO button, this editor prevent me adding those attribute:

YES-onclick: exitPageConfirmDialog.hide(); exitPageConfirmDialog.confirmation.resolve();

NO-onclick: exitPageConfirmDialog.hide(); exitPageConfirmDialog.confirmation.reject();


  1. create 2 pages, the second page will have this script, and an input to interact with (some browser like Chrome will not execute event unless you interact with some field inside the page).
  2. open the first page, then click on a link to navigate to the second page.
  3. type some thing in the input field
  4. click on Back button, you will see the confirm message and YES/NO button (you should use style="display: none" on the dialog, I could not put it in this answer because of the editor).
  5. When click YES, you will go back. When click NO, you will stay. If you remove the YES button, you will always keep user stay on the page.

In case you want temporary disable the dialog, use


Enable again


Known issue

  1. Confirm dialog does not show if you are not interact with the page.

answered 10.03.2020 at 12:15

vinh_'s gravatar image

accept rate: 40%

Your answer
toggle preview

Follow this question

By Email:

Once you sign in you will be able to subscribe for any updates here



Answers and Comments

Markdown Basics

  • *italic* or _italic_
  • **bold** or __bold__
  • link:[text]( "Title")
  • image?![alt text](/path/img.jpg "Title")
  • numbered list: 1. Foo 2. Bar
  • to add a line break simply add two spaces to where you would like the new line to be.
  • basic HTML tags are also supported



Asked: 18.02.2020 at 09:23

Seen: 8,169 times

Last updated: 22.07.2020 at 05:21