第二个移动页面上不显示growl

时间:2016-06-30 20:39:08

标签: jsf jsf-2 primefaces primefaces-mobile

在单个xhtml上,我有两页(p:page)。每个页面都有一个表单,每种形式都有一个咆哮定义。当我在第一页时,单击按钮会显示咆哮声。但是,当我在第二页时,不会显示咆哮声。以下是可重现的示例代码。

原因,为什么我没有使用update =" @ form",是在覆盖面板中有另一种形式并通过@(。errorHandlingPanel)选择器,我应该能够轻松触发咆哮,不知道我目前在哪个页面。

<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:p="http://primefaces.org/ui"
      xmlns:pm="http://primefaces.org/mobile"
      xmlns:ui="http://java.sun.com/jsf/facelets">

<f:view renderKitId="PRIMEFACES_MOBILE"/>

<h:head>
</h:head>

<h:body>
    <pm:page id="first">
        <pm:header title="Page 1"></pm:header>
        <pm:content>
            <h:form id="form1">

                <ui:include src="error_handling.jspx"/>

                <p:commandButton id="btn1" value="Save" actionListener="#{growlViewDev.saveMessage}"
                                 update="@(.errorHandlingPanel)"
                                 icon="check"/>
            </h:form>
        </pm:content>
        <pm:footer>
             <p:tabMenu>
                 <p:menuitem value="Page 1"
                        outcome="pm:first?transition=slide"/>
                 <p:menuitem value="Page 2"
                        outcome="pm:second?transition=slide"/>
            </p:tabMenu>
         </pm:footer>
    </pm:page>

    <pm:page id="second">
        <pm:header title="Page 2"></pm:header>
        <pm:content>
            <h:form id="form2">
                <ui:include src="error_handling.jspx"/>

                <p:commandButton id="btn2" value="Save" actionListener="#{growlViewDev.saveMessage2}"
                                 update="@(.errorHandlingPanel)"
                                 icon="check"/>
            </h:form>
        </pm:content>
        <pm:footer>
             <p:tabMenu>
                 <p:menuitem value="Page 1"
                        outcome="pm:first?transition=slide"/>
                 <p:menuitem value="Page 2"
                        outcome="pm:second?transition=slide"/>
            </p:tabMenu>
         </pm:footer>
    </pm:page>
</h:body>
</html>

- error_handling.jspx

<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:p="http://primefaces.org/ui"
        >
  <ui:composition>
      <p:outputPanel styleClass="errorHandlingPanel">
          <p:growl showDetail="true" showSummary="true" escape="false" sticky="true" globalOnly="true"/>
      </p:outputPanel>
  </ui:composition>
</html>

- 托管bean

 @ManagedBean
 public class GrowlViewDev {

    public void saveMessage() {
      FacesContext context = FacesContext.getCurrentInstance();

      context.addMessage(null, new FacesMessage("Successful",  "Your message: Button 1") );
      context.addMessage(null, new FacesMessage("Second Message", "Additional Message Detail"));
    }

    public void saveMessage2() {
        FacesContext context = FacesContext.getCurrentInstance();

        context.addMessage(null, new FacesMessage("Successful",  "Your message: Button 2") );
        context.addMessage(null, new FacesMessage("Second Message", "Additional Message Detail"));
    }
}

使用5.1,5.2和5.3进行测试

谢谢,ilhami visne

1 个答案:

答案 0 :(得分:0)

不知何故,似乎在页面导航后没有调用show方法。我发现的唯一解决方法是使用以下方法手动显示ajax组件oncomplete属性中的消息:

<p:growl id="growl" widgetVar="growlWidgetVar"/>

<p:commandButton outcome="pm:otherPage" update=":growl" oncomplete="showGrowl('growlWidgetVar');"/>

/* 
 * show current growl message again - PF-mobile bug on page navigation not showing it 
 * 
 * @param widgetVar PF widgetVar
 */
function showGrowl(widgetVar)
{
    PF(widgetVar).show(PF(widgetVar).cfg.msgs);
}

如果要显示咆哮,导航通常会占据一席之地。对于这种情况,请在pageshow处理程序中调用它:

$(document).on('pageshow', '#myPage', function(){
    showGrowl('growlWidgetVar');
});