RichFacesPleaseWaitBox

    How to show a "Please Wait" box and block the input while the Ajax request is processed

     

    You can use a combination of a4j:status and rich:modalPanel. This is a code snippet:

     

     

    <a4j:status onstart="Richfaces.showModalPanel('ajaxLoadingModalBox',{width:450, top:200})" 
         onstop="Richfaces.hideModalPanel('ajaxLoadingModalBox')"></a4j:status>
    ....
    
    <rich:modalPanel id="ajaxLoadingModalBox" minHeight="200" minWidth="450" 
            height="100" width="250" zindex="2000">
         <f:facet name="header">
              <h:outputText value="Request being processed"></h:outputText>
         </f:facet>
         <h:outputText value="Your request is being processed, please wait."></h:outputText>
    </rich:modalPanel> 

     

    You can also set timeout before showing modal panel. This example is for timeout 500 ms:

     

    <script type="text/javascript">
         var infoWindowAMShown = false;
         var infoWindowAMTimer;
         function showModalInfoWindow()
         {
              infoWindowAMTimer = setTimeout("if(!infoWindowAMShown){Richfaces.showModalPanel('ajaxLoadingModalBox');infoWindowAMShown=true;}", 500);
         }
         function hideModalInfoWindow()
         {
              if (infoWindowAMShown){Richfaces.hideModalPanel('ajaxLoadingModalBox');infoWindowAMShown=false;}else{if(infoWindowAMTimer)clearTimeout(infoWindowAMTimer);}
         }
    </script>
    
    
    <a4j:status onstart="showModalInfoWindow();" 
         onstop="hideModalInfoWindow()"></a4j:status>
    ....
    
    <rich:modalPanel id="ajaxLoadingModalBox" minHeight="200" minWidth="450" 
            height="100" width="250" zindex="2000">
         <f:facet name="header">
              <h:outputText value="Request being processed"></h:outputText>
         </f:facet>
         <h:outputText value="Your request is being processed, please wait."></h:outputText>
    </rich:modalPanel> 

     

    -


    Source: Jboss RichFaces forum