JSF 2.2;PrimeFaces 5.3
我的目标是通过点击X按钮捕获用户关闭对话框，返回到父页面，以便数据可以刷新和更新表单。
我能够得到p:remoteCommand调用我的confirmAndCloseDialog()方法在DialogBean，但ondialegreturn()方法在ParentBean从未被调用。为什么不调用ondialgreturn ?有什么办法能让它工作吗?
顺便说一句，如果用户以正常的方式退出对话框，即通过点击p:commandButton (close dialog)关闭对话框，那么一切都很好。
这是我的代码。谢谢!
父页面:<h:form>
...
<p:commandButton value="Open dialog"
id="openDialogButton"
actionListener="#{parentBean.openDialog()}"
update="@form">
<p:ajax event="dialogReturn"
listener="#{parentBean.onDialogReturn}"
update="@form"/>
</p:commandButton>
...
</h:form>
对话框页面:
<body style="height: 80%;" onunload="userClickOnX();" >
<h:form id="aForm">
<p:remoteCommand id="userClickOnX"
name="userClickOnX"
actionListener="#{dailogBean.confirmAndCloseDialog}"/>
......
<p:commandButton id="closeDialog"
value="CLOSE DIALOG"
actionListener="#{dialogBean.confirmAndCloseDialog}"/>
</h:form>
</body>
ParentBean
public void openDialog() {
Map<String, Object> options = new HashMap<>();
options.put("modal", true);
options.put("draggable", true);
options.put("resizable", true);
options.put("closable", true);
options.put("contentWidth", "100%");
options.put("contentHeight", "100%");
options.put("width", 1000);
options.put("height", 800);
RequestContext.getCurrentInstance().openDialog("dialog", options, null);
}
public void onDialogReturn(SelectEvent event) {
refresh data ....
}
DialogBean:
public void confirmAndCloseDialog() {
RequestContext.getCurrentInstance().closeDialog(objectForParent);
}
4年后，Primefaces的对话框框架默认关闭的"X"按钮仍然只是一个链接，并使用javascript隐藏对话框，这就是为什么在使用该按钮时没有触发dialgreturn事件。我不知道如何"拦截"它的行动。所以如果你不想用一个自定义按钮来关闭对话框，那你就不走运了，但你总是可以重新发明轮子，就像:
- 复制Primefaces的按钮并使其更好:)
<h:body>
<h:form id="formToolbar">
<a class="ui-dialog-titlebar-icon ui-dialog-titlebar-close ui-corner-all" href="#"
role="button"
style="float: right; position: relative; top: -10px; left: -3px; color: #757575;"
onclick="close()">
<span class="ui-icon ui-icon-closethick"></span>
</a>
<p:remoteCommand id="close" name="close" action="#{dialogController.close()}">
</p:remoteCommand>
</h:form>
...
<h:body>
你可以根据自己的喜好调整位置和颜色
- 对话框bean:
public void close() {
PrimeFaces.current().dialog().closeDynamic(null);
}
- 现在你可以期待在父页面和相应的bean中出现returnDialog事件。
<p:commandButton action="#{parentBean.openDialog(param)}">
<p:ajax event="dialogReturn" listener="#{parentBean.handleReturn()}"/>
</p:commandButton>
- 记住在打开对话框时将close设置为false，否则你将有两个"X"按钮:
Map<String,Object> options = new HashMap<String, Object>();
options.put("closable", false);
options.put("draggable", false);
PrimeFaces.current().dialog().openDynamic(
"dialog",
options,
null)
PS:我将draggable设置为false，你仍然可以使用draggable模式，但这会在对话框的顶部创建一个无法在对话框的页面内到达的栏，所以你的"X"按钮将被定位在底部，这不是美观的。希望拖拽不是必须的
设置对话框配置了吗?根据:http://www.primefaces.org/docs/guide/primefaces_user_guide_5_3.pdffaces-config.xml
<application>
<action-listener>
org.primefaces.application.DialogActionListener
</action-listener>
<navigation-handler>
org.primefaces.application.DialogNavigationHandler
</navigation-handler>
<view-handler>
org.primefaces.application.DialogViewHandler
</view-handler>
</application>
Also - your:应该在对话框的div/结构中，而不是在你选择的按钮中。