我们最近迁移到 PrimeFaces 11 并更改了代码以按照 https://primefaces.github.io/primefaces/11_0_0/#/core/dialogframework 打开和关闭对话框。
打开具有 Okay 和 Cancel 按钮的对话框工作正常，但是当单击对话框内的 Okay 或 Cancel 按钮时，它不会关闭对话框，并且应用程序中也没有错误作为服务器日志。
示例代码如下：
模板对话框.xhtml
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:h="http://java.sun.com/jsf/html" xmlns:f="http://java.sun.com/jsf/core"
xmlns:ui="http://java.sun.com/jsf/facelets" xmlns:p="http://primefaces.org/ui">
<!-- HEAD -->
<h:head>
<h:outputScript library="js" name="growl_updater.js" />
<h:outputScript library="js" name="spear.js" />
<title><h:outputText value="#{dialogTitle}" /></title>
</h:head>
<!-- /HEAD -->
<h:body class="dialog-body">
<div class="dialog-wrapper">
<s:tooltip />
<!-- CONTENT include -->
<p:outputPanel id="dialog_content">
<ui:insert name="dialog_content">
<ui:include src="content.xhtml" />
</ui:insert>
</p:outputPanel>
<!-- /CONTENT include -->
<h:form id="dialog_conversation_form" rendered="#{not empty killCid and not empty conversationModel}">
<p:remoteCommand name="handleClose" actionListener="#{conversationModel.endConversation}" async="false" />
</h:form>
<!-- Widgets -->
<p:blockUI widgetVar="content_blocker" block="dialog_content">
<ui:include src="/templates/blockui/loading.xhtml" />
</p:blockUI>
<ui:insert name="exception_handler">
<ui:include src="exception-handler.xhtml" />
</ui:insert>
<ui:insert name="messages">
<p:growl id="dialog_warn_messages" for="dialog_warn_messages" widgetVar="dialog_warn_messages_widget" globalOnly="true" sticky="true" severity="warn" redisplay="false" />
<p:growl id="dialog_error_messages" for="dialog_error_messages" widgetVar="dialog_error_messages_widget" globalOnly="true" sticky="true" severity="error,fatal" >
<p:autoUpdate />
</p:growl>
<p:growl id="dialog_info_messages" for="dialog_info_messages" widgetVar="dialog_info_messages_widget" globalOnly="true" sticky="false" severity="info" >
<p:autoUpdate />
</p:growl>
<p:growl id="warn_messages" widgetVar="warn_messages_widget" globalOnly="true" sticky="true" severity="warn" redisplay="false" />
<p:growl id="error_messages" widgetVar="error_messages_widget" globalOnly="true" sticky="true" severity="error,fatal" >
<p:autoUpdate />
</p:growl>
<p:growl id="info_messages" widgetVar="info_messages_widget" globalOnly="true" sticky="false" severity="info" >
<p:autoUpdate />
</p:growl>
</ui:insert>
</div>
</h:body>
</html>
TestDialog.xhtml
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:h="http://java.sun.com/jsf/html" xmlns:f="http://java.sun.com/jsf/core"
xmlns:ui="http://java.sun.com/jsf/facelets" xmlns:p="http://primefaces.org/ui">
<ui:composition template="/templates/dialog/dialog.xhtml">
<ui:param name="dialogTitle" value="#{testMsg}" />
<ui:define name="dialog_content">
<h:form id="test_form">
<p:panel>
<p:panelGrid id="test_group" columns="2">
<h:panelGroup>
<p:focus context="test_group" />
<p:outputLabel for="test_value" value="#{testMsg.testValue}" />
</h:panelGroup>
</p:panelGrid>
<p:toolbar>
<p:toolbarGroup>
<p:commandButton value="#{testMsg.okayBtn}" actionListener="#{testActions.acceptAndClose()}">
</p:commandButton>
<p:commandButton value="#{testMsg.cancelBtn}" actionListener="#{testActions.cancel()}"
partialSubmit="true" process="@this">
</p:commandButton>
</p:toolbarGroup>
</p:toolbar>
</p:panel>
</h:form>
</ui:define>
</ui:composition>
</html>
TestAction.java
@Named
@RequestScoped
public class TestAction {
public static final Map<String, Object> POPUP_OPTIONS;
public static final String URL = "/popup/TestDialog.xhtml";
static {
Map<String, Object> map = new HashMap<String, Object>();
map.put("modal", Boolean.TRUE);
map.put("draggable", Boolean.FALSE);
map.put("resizable", Boolean.FALSE);
POPUP_OPTIONS = map;
}
private BigDecimal value;
public void acceptAndClose() {
PrimeFaces.current().dialog().closeDynamic(value);
}
public void cancel() {
PrimeFaces.current().dialog().closeDynamic(null);
}
}
main.xhtml页面有一个名为“验证”的按钮，该按钮具有打开对话框的操作，
<p:commandButton id="value_btn" value="#{buttonMsg.valueBtn}"
action="#{mainAction.openValueAction}" process="@form"
disabled="#{mainAction.testValueButtonDisabled}" onstart="PF('content_blocker').show()"
oncomplete="PF('content_blocker').hide()" update="@form">
<f:param name="cid" value="#{mainModel.conversationId}" />
<p:ajax event="dialogReturn" listener="#{mainAction.valueListener}" update="@form" />
</p:commandButton>
MainAction.java
@Named
@RequestScoped
@ExceptionsReported
public class MainAction {
public void openValueAction() {
Map<String, List<String>> params = new HashMap<String, List<String>>();
params.put("cid", Arrays.asList(new String[] { model.getConversationId().toString() }));
PrimeFaces.current().dialog().openDynamic(TestAction.URL, TestAction.POPUP_OPTIONS, params);
}
public void valueListener(SelectEvent event) {
// get value from Okay or Cancel from Dialog
}
}
相同的代码使用
RequestContext.getCurrentInstance().openDialogRequestContext.getCurrentInstance().closeDialog我尝试了各种解决方案并完成了https://github.com/primefaces/primefaces/issues但无法找到问题。
发现了这个问题，我们在远程系统中有自定义的.js文件，它覆盖了导致此问题的对话框功能的打开和关闭。
我们根据 primefaces 11 更新了此自定义 .js 文件，然后对话框的打开和关闭再次正常工作。