Jsf 2 在blockUI中显示图像

我正在使用primefaces和jsf2。我需要在点击commandButton后显示一个图像，并在操作完成时隐藏。一切正常，但blockUI中的图像无法显示

 <p:panel id="panelform" header="Email Extractor"  >
        <p:messages id="messages" /> 
        <h:panelGrid id="formulaire" columns="2">  
              <p:commandButton value="Extract" update="tableemails" id="ajax"  widgetVar="extractButton"
                                                 action="#{mailMB.searchEmails()}" 
                                                 icon="ui-icon-disk" styleClass="ui-priority-primary"
                                                 onstart="blockUIWidget1.block()" oncomplete="blockUIWidget1.unblock()"/>  
        </h:panelGrid>
        <pe:blockUI  target="formulaire"  widgetVar="blockUIWidget1">  
              <h:panelGrid columns="2"> 
                    <img src="../../pictures/animated-loading-bar.gif" width="264" height="34" alt="animated-loading-bar"/>
                    <h:outputText value="Please wait..." style="white-space: nowrap;"/>  
               </h:panelGrid>  
        </pe:blockUI>
 </p:panel>  

以下是我的目录结构：

---

阅读了大量论坛后，我发现BlockUI只监听AJAX调用！它不适用于整页（非AJAX）请求。它仅在发布目录结构时才起作用。另外，请尝试使用

而不是

标记。