2017-02-24 14 views
1

我試圖下載一個大型文件,使用<h:commandButton>,我想通過向用戶顯示下載操作需要幾秒/分鐘來顯示「等待」模式。調用h後關閉模態面板:commandButton submit

我的問題是,我可以用按鈕的onclick事件顯示圖像,但我不知道如何在動作完成時隱藏它(這是顯示對話框彈出以下載文件時)。

我的代碼是這樣的:

<h:form id="form"> 

    <h:commandButton value="Download" 
     action="#{bean.downloadFile()}" 
     onclick="showModal('waitModal')"/> 

     <div id="waitModal" class="modal fade" tabindex="-1" 
      role="dialog"> 
      <div class="modal-dialog" role="document"> 
       <div class="modal-content"> 
        <div class="modal-body"> 
         WAIT! 
        </div> 
       </div> 
      </div> 
     </div> 

</h:form> 

一種解決方案中的bean中使用標誌,並呼籲與檢查標誌的價值超時JavaScript函數和關閉模式,當下載完成,但它是不是我要找的...它應該是更通用的,因爲我必須在幾個地點應用它

我知道有幾個類似的問題,但我沒有找到任何解決方案,我可以適用於我的問題。

謝謝!

+0

您是否想過使用PrimeFaces?他們在展示中爲您的問題提供了一個示例:[p:fileDownload](http://www.primefaces.org/showcase/ui/file/download.xhtml)。 –

+0

我想到了這個選擇,但是隻爲這種情況增加一個新的框架並不是我們目前正在考慮的事情。謝謝! – davidml

回答

0

PrimeFaces用p:fileDownload解決了您的問題。如果你不想使用PrimeFaces,你至少可以看看他們是如何實現它的。

PrimeFaces將cookie設置爲指示下載完成的響應。在客戶端,他們使用在點擊下載按鈕時註冊的window interval function。此功能以特定間隔檢查提到的cookie。如果cookie被設置,它將被重置,間隔函數將被取消註冊,並且會調用一個回調函數來關閉對話框。

有關實施細節,請參閱PrimeFaces'core.js中的monitorDownload方法和p:fileDownload的實施。

我認爲這很容易實現,你可以很好地重用它。我不認爲有另一個更好的解決方案,因爲文件下載需要一個完整的頁面請求(而不是ajax請求),所以你不能註冊回調函數或類似的東西。