Primefaces对话框框架-打开对话框-关闭它-打开另一个对话框 [英] Primefaces Dialog Framework - Open dialog - close it - open another dialog

问题描述

Primefaces 5.0，JSF 2.2，Wildfly 8.1

以下用例:

1. 单击视图中的命令按钮(带有一些参数)
2. bean方法在数据库中查找内容-如有必要，显示 dialog1 .在 dialog1 中，有一个表单和一个命令按钮.
3. 单击 dialog1 中的命令按钮，bean方法将在数据库中查找内容.
关闭
4. Dialog1 ，并显示 dialog2 ，具体取决于bean方法的结果.

1. Click a command button in a view (with some parameters)
2. The bean method looks something up in the database - if necessary dialog1 is shown. In dialog1 there is a form and a command button.
3. The command button in dialog1 is clicked, the bean method looks something up in the database.
4. Dialog1 is closed and dialog2, depending on the result of the bean method, is shown.

bean1.java:

public void buttonClicked() {

    Map<String, Object> options = new HashMap<>();
    options.put("modal", true);
    options.put("widgetVar", "dialog1");
    options.put("id", "dlg1");

if(somethingTrue()) {
RequestContext.getCurrentInstance().openDialog("dialog1.xhtml", options, null);
    }
}

一切都很好.出现Dialog1.

Everything fine. Dialog1 shows up.

dialog1.xhtml:

<h:body>
    <h:form>
        <p:commandButton value="Button" actionListener="#{bean2.dialog1ButtonClicked}" />
    </h:form>
</h:body>

bean2.java:

public void dialog1ButtonClicked() {        
    Map<String, Object> options = new HashMap<>();
    options.put("modal", true);
    options.put("widgetVar", "dialog2");
    options.put("id", "dlg2");    

if(somethingTrue()) {
    RequestContext.getCurrentInstance().openDialog("dialog2.xhtml", options, null);
    }
}

dialog2.xhtml:

<h:body>        
    The operation was successful.
</h:body>

Dialog2出现在dialog1中！

在打开dialog2之前，我尝试使用Primefaces对话框框架关闭dialog1:

I tried closing dialog1 with Primefaces Dialog Framework before opening dialog2:

RequestContext.getCurrentInstance().closeDialog(null);
RequestContext.getCurrentInstance().openDialog("dialog2.xhtml", options, null);

Dialog2没有出现.

Dialog2 doesn't show up.

我尝试在AJAX回调<p:ajax event="dialogReturn" listener="#{bean1.dialogClosed}"/>之后打开dialog2 Dialog2没有显示.

I tried opening dialog2 after the AJAX callback <p:ajax event="dialogReturn" listener="#{bean1.dialogClosed}"/> Dialog2 doesn't show.

我尝试了客户端Java脚本调用:onclick="PF('dialog1').hide()"

I tried the client side Java Script call: onclick="PF('dialog1').hide()"

Dialog2仍然显示嵌套在dialog1中.

Dialog2 still shows up nested into dialog1.

推荐答案

解决方案:

• 仅打开一个对话框: RequestContext.getCurrentInstance().openDialog("dialog1.xhtml", options, null);
  • 对话框流由主面板的ajax更新控制，其中呈现的属性绑定到bean属性，因此完全由bean控制.
  • Open just one dialog: RequestContext.getCurrentInstance().openDialog("dialog1.xhtml", options, null);
    • The dialog flow is controlled by an ajax update of the main panel, where the rendered attribute is bound to a bean property and therefore completely controlled by the bean.

    dialog1.xhtml:

    <p:dialog class="userRegisterDialog" header="#{bean.dailogHeader}" 
                              modal="true" resizable="false" draggable="false">
    
        <p:ajax event="close" listener="#{bean2.closeRegistration}" update=":update"/>
    
        <p:panel id="update">
            <p:panel id="step1" rendered="#{bean.showStep1}">
                <h:form>
                    <p:commandButton class="continueButton" value="Button1" actionListener="#{bean.doStep1}" update=":update"/>
                </h:form>
            </p:panel>
            <p:panel id="step2" rendered="#bean.showStep2}">                        
                <h:form>
                    <p:commandButton class="closeButton" value="Button2" actionListener="#{bean.doStep2}" update=":update"/>
                </h:form>               
            </p:panel>
        </p:panel>
    </p:dialog>
    

    对话框bean:

    import java.io.Serializable;
    import javax.faces.bean.ManagedBean;
    import javax.faces.bean.ViewScoped;
    import javax.faces.context.FacesContext;
    import javax.faces.event.ActionEvent;
    
    @ManagedBean
    @ViewScoped
    public class Bean implements Serializable 
        {
    
        private boolean showStep1 = true;
        private boolean showStep2 = false;
    
        public void doStep1(ActionEvent actionEvent) {
    
            if(doSomething())
            {
                setShowStep1(false);            
                setShowStep2(true);
            }
        }            
    
        public void doStep2(ActionEvent actionEvent) {
    
            if(doSomething2())
            {
                RequestContext.getCurrentInstance().closeDialog(null);
            }
        }
    
        // Getter and setter ...    
    }
    

    对话框关闭的另一个bean:

    Another bean for the dialog closing:

    @ManagedBean
    @RequestScoped
    public class Bean2 implements Serializable {
        public void closeRegistration() { 
             FacesContext.getCurrentInstance().getViewRoot().getViewMap().remove("bean");
        }    
    }
    

    方法 closeRegistration 删除了范围镜的bean.因此，在同一页面中再次调用该对话框将从头开始对话流程.

    The method closeRegistration removes the viewscoped bean. Therefore another call of the the dialog within the same page will start the dialog flow from the beginning.

    这篇关于Primefaces对话框框架-打开对话框-关闭它-打开另一个对话框的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！