onFlowProcess / onnext 之后的 Primefaces 向导事件答案

【问题标题】：Primefaces wizard event after onFlowProcess / onnextonFlowProcess / onnext 之后的 Primefaces 向导事件
【发布时间】：2017-06-13 20:27:16
【问题描述】：

我正在使用 primefaces (6.0) 向导，并希望在显示选项卡后调用 javascript 代码。

<p:wizard flowListener="#{bb.onFlowProcess}" onnext="PF('waitDlg').show()"> ...

我需要的是oncomplete="PF('waitDlg').hide()"

我可以在bb.onFlowProcess 结束时调用它，但是，当出现验证错误时，bb.onFlowProcess 不会被调用，对话框也不会隐藏。

是否有解决方案或解决方法？

【问题讨论】：

标签： javascript jsf primefaces jsf-2

【解决方案1】：

我能够通过执行以下操作来实现它（为了清楚起见，省略了一些代码）：

移除导航栏

<p:wizard flowListener="#{bb.onFlowProcess}" widgetVar="wizard" onnext="PF('waitDlg').show()" showNavBar="false>

为导航添加了命令按钮

<p:commandButton styleClass="nextBtn" value="Next" onstart="PF('wizard').next();" oncomplete="hideOnValidationFail(args, 'waitDlg')"/>

保留代码以在onFlowProcess end 处执行 js

 try {
     // code
 } finally {
     executeJavaScript("PF('waitDlg').hide()");
 }

如果想要显示/隐藏导航按钮，我使用一点 jquery 来实现

 <p:tab id="tab1" title="Tab 1">
    <script type="text/javascript">
        $(document).ready(function() {
            $(".backBtn").hide();
            $(".nextBtn").show();
            $(".finishBtn").hide();
        });
    </script>
    // tab code
</p:tab>

<p:tab id="tab2" title="Tab 2">
    <script type="text/javascript">
        $(document).ready(function() {
            $(".backBtn").show();
            $(".nextBtn").show();
            $(".finishBtn").hide();
        });
    </script>
    // tab code
</p:tab>

【讨论】：