How to interrupt navigation and show p:dialog during onbeforeunload

Question

I'm trying to check my JSF application editing.xhtml page before navigate to other page (can any other xhtml) by using primefaces Ajax framework for example:

<h:head>
  <script type="text/javascript">
    function Geeks() {
        onunloadCheck();
        alert("onunload event attribute called");
    }
  </script>
</h:head>
<h:body onunload="Geeks()">
......
<p:remoteCommand name="onunloadCheck" action="#{customerSWController.leavingCustomerView()}"

when the navigation to other-age from this xhtml, I can catch backend logger info that produced by customerSWController.leavingCustomerView()

logger as:

[2023-09-25T11:04:26.215+1000] [Payara 6.2023.9] [INFO] [] [com.longz.thss.web.ozssc.controller.CustomerStaffWebController] [tid: _ThreadID=97 _ThreadName=http-thread-pool::http-listener-1(4)] [timeMillis: 1695603866215] [levelValue: 800] [[
   Leaving customer view page.]]

That means, onunload event was caught and called backend (controller) successfully.

my backend method as:

public void leavingCustomerView(){
    logger.info("Leaving customer view page.");
    PrimeFaces.current().dialog().openDynamic(CUSTOMER_EDIT_UN_SAVE_DIA, buildOptionsForDialog(), null);
}

But When I tried to add an extra logic to let backend to create a primefaces dialog and interrupt the MVC controller routed result page, I never get it successfully.

My question is:

Is there any way to interrupt MVC navigation when navigate button pressed? I means the UI will be leading to the dialog that generate by backend instead of the navigation result page?