最新消息:雨落星辰是一个专注网站SEO优化、网站SEO诊断、搜索引擎研究、网络营销推广、网站策划运营及站长类的自媒体原创博客

javascript - How to display a Primefaces confirm dialog when navigating to another page? - Stack Overflow

programmeradmin4浏览0评论

I am trying to display a Primefaces confirm dialog when user tries to navigate away from the page. The current page may have some unsaved data and hence the dialog to ask the user if he/she wants to save them before leaving the page.

At the moment I can just show the confirm dialog when user clicks away from the page like this:

function onBeforeUnload_Handler(){
 confirmation.show(); // confirmation is the "widgetVar" value of p:confirmDialog
} 

window.onbeforeunload = onBeforeUnload_Handler;

However the problem is that on displaying the dialog it navigates to the other page without waiting for a response from the user. I want the current page to wait for user response and perform an operation like "save" or "don't save" and then navigate away.

I tried adding "return false" after "confirmation.show()" but that causes the browser alert box to pop up instead.

(Primefaces 3.0.M1)

Many Thanks

I am trying to display a Primefaces confirm dialog when user tries to navigate away from the page. The current page may have some unsaved data and hence the dialog to ask the user if he/she wants to save them before leaving the page.

At the moment I can just show the confirm dialog when user clicks away from the page like this:

function onBeforeUnload_Handler(){
 confirmation.show(); // confirmation is the "widgetVar" value of p:confirmDialog
} 

window.onbeforeunload = onBeforeUnload_Handler;

However the problem is that on displaying the dialog it navigates to the other page without waiting for a response from the user. I want the current page to wait for user response and perform an operation like "save" or "don't save" and then navigate away.

I tried adding "return false" after "confirmation.show()" but that causes the browser alert box to pop up instead.

(Primefaces 3.0.M1)

Many Thanks

Share Improve this question edited May 1, 2012 at 15:22 Shadow Wizzard 66.4k26 gold badges146 silver badges209 bronze badges asked Aug 12, 2011 at 4:18 ZakiMakZakiMak 2,1022 gold badges18 silver badges26 bronze badges 0
Add a ment  | 

3 Answers 3

Reset to default 1

You could try something like this:

<p:mandButton value="Next Page" onclick="confirmation.show();" />

<p:confirmDialog .....message="Are you sure?">
<p:mandButton value="Yes" action="nextpage?faces-redirect=true" />
<p:mandButton value="No" onclick="confirmation.hide();" />
</p:confirmDialog>
window.onbeforeunload = function() {
    return 'There are unsaved changes!';
}

The value you return from the handler function is displayed in the pop-up dialog box. So you can just tell the user that there is some unsaved data and he might want to save it, and you can then leave it to the user whether he wants to navigate away or rather stay and save manually.

Alternatively you can use a 'Synchronous' AJAX request inside the 'onbeforeunload' handler to update changes to the server. It will stall the browser until the request pletes. It works for IE,FF,Chrome but won't work for Opera.

This is to let others know what I ended up doing in the end. I couldn't find any way to get it done with the version of Primefaces I was using. So ended up using the default browser alert box to notify the user and take the required steps.

发布评论

评论列表(0)

  1. 暂无评论