h：commandButtonを実行した後にモーダルパネルを閉じる

Question

大きなファイルを<h:commandButton>でダウンロードしようとしています。ダウンロード操作に「待機」モーダルを表示すると、ダウンロード操作に数秒/分かかることをユーザーに警告します。

私の問題は、ボタンの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> 

ソリューションは、豆のフ​​ラグを使用することになり、フラグの値をチェックし、タイムアウトでJavaScript関数を呼び出し、ダウンロードが終了したときにモーダルを閉じますが私が探しているものではありません...私はいくつかの場所で

それを適用する必要があるため、それは私がいくつかの同様の質問があります知っているが、私は私がに適用することができます任意の解決策を見つけることができませんでした、より汎用的でなければなりません私の問題。すべての

ありがとう！

Answer 1

PrimeFacesはp:fileDownloadであなたの問題を解決しました。 PrimeFacesを使用したくない場合は、少なくとも実装方法を見てください。

PrimeFacesダウンロードが完了したことを示す応答にクッキーを設定します。クライアント側では、ダウンロードボタンをクリックすると登録されたwindow interval functionを使用します。この関数は、指定されたクッキーを特定の間隔でチェックします。クッキーが設定されている場合はリセットされ、インターバル関数は登録解除され、ダイアログを閉じるために使用できるコールバック関数が呼び出されます。

実装の詳細については、PrimeFacesのcore.jsのmonitorDownloadメソッドとp:fileDownloadの実装を参照してください。

私はそれを実装するのは簡単だと思うと、あなたは非常によく、それを再利用することができます。ファイルのダウンロードにはフルページリクエスト（ajaxリクエストではない）が必要なので、コールバック関数などを登録することはできません。