使用f：ajax等待數據完成處理，然後更新

Question

我很難與網格化JSF，AJAX和JavaScript。以下是我正在嘗試執行的操作：

當用戶提交表單時，它們被定向到一個新頁面。頁面最初會檢查他們的提交是否已處理，如果沒有，則顯示進度條（請參閱Twitter Bootstrap）。然後，我使用f：ajax來檢查它是否已經完成處理。方法被調用; waitForProcessing;它只是等待處理設置爲true，然後返回true。此時，f：ajax應該調用JavaScript將進度條設置爲不可見，然後更新頁面。代碼如下：

<ui:define name="content"> 

     <c:choose> 
      <c:when test="#{not submission.isIsProcessed}"> 
       <f:ajax onevent="setVisibility('processing-dialog', 'none'); setVisibility('processing-backdrop', 'none');" listener="#{submission.waitForProcessing}" status="success" /> 

       <div class="modal-backdrop fade in" id="processing-backdrop"></div> 
       <div id="processing-dialog" class="modal hide fade in" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="false" style="display: block;"> 
        <div class="modal-header"> 
         <h3 id="myModalLabel">One sec...</h3> 
        </div> 
        <div class="modal-body"> 
         <p>We are compiling and running your code!</p> 
         <div class="progress progress-striped active"> 
          <div class="bar" style="width: 40%;"></div> 
         </div> 
        </div> 
       </div> 
      </c:when> 
     </c:choose> 
....... 
....... 

有些東西在這裏不起作用。首先，f：ajax拋出一個異常，因爲顯然f：ajax只能嵌套在某些組件中。有一個更好的方法嗎？目標是顯示進度條，直到後端處理完成。這個處理可能需要幾分鐘時間，這就是爲什麼我要經歷麻煩，而不是讓頁面自己加載直到數據準備就緒。

Answer 1

您的問題是f：ajax只執行一次執行。如果要多次執行相同的ajax調用，則應該使用輪詢組件，該組件僅在PrimeFaces，RichFaces和其他框架中可用。 RichFaces有一個完全按照您描述的方式工作的組件（它在內部使用輪詢）。你可以在這裏檢查它：RichFaces Progress Bar。