PrimeFacesのカウントダウンタイマーconfirmDialog

タイマーを毎秒更新するJavaScript間隔（または必要なその他の間隔）を作成する必要があります。少しのjQueryを使用してタイマーを更新できます。タイマーとして使用できるダイアログメッセージにスパンを追加することをお勧めします。

$("#myForm\\:confirmDialog .ui-confirm-dialog-message").append("<span id=logoffTimeout/>");

myFormこちらのフォームで使用したIDに置き換える必要があります。

ダイアログが表示されたら、ログオフタイマーが期限切れになる時間を計算し、たとえばに保存しwindow.logoffTimeます。これで、次の関数を使用してタイマーを更新できます。

function updateTimer(){
  var seconds = Math.ceil((window.logoffTime - new Date().getTime()) / 1000);
  $("#logoffTimeout").html(seconds);
}

ボタンとリモートコマンドでは、を使用することをお勧めしますprocess="@this"。参照：PrimeFacesプロセス/更新およびJSF f：ajax実行/レンダリング属性について

JavaScriptでタイムアウトを開始すると、IDが返されることを知っておく必要があります。そのIDを使用してタイムアウトをクリアできます。

私はこのXHTMLに行き着きました：

<p:confirmDialog id="confirmDialog"
                 message="Please click Ok before the timer runs out: "
                 header="Are you there?"
                 severity="alert"
                 closable="false"
                 widgetVar="idleDialog">
  <p:commandButton id="confirm"
                   value="Ok"
                   process="@this"
                   onclick="clearTimeout(window.logoffTimeoutId); PF('idleDialog').hide();"/>
</p:confirmDialog>

<p:remoteCommand name="terminateIdleSession"
                 actionListener="#{idleMonitorView.onIdle}"
                 process="@this"
                 out="count"/>

<p:idleMonitor timeout="#{5 * 60 * 1000}"
               onidle="startTimer()"/>

そしてこのJavaScript：

function startTimer() {
  clearTimeout(window.logoffUpdaterId);
  PF('idleDialog').show();
  // Set timeout to 2 minutes
  var timeout = 2 * 60 * 1000;
  // Calculate when the time runs out
  window.logoffTime = new Date().getTime() + timeout;
  // Start timer which calls remote command
  window.logoffTimeoutId = setTimeout(terminateIdleSession, timeout);
  // Update timer every second
  window.logoffUpdaterId = setInterval(updateTimer, 1000);
  // Update timer now
  updateTimer();
}

// Update the timer
function updateTimer() {
  var seconds = Math.ceil((window.logoffTime - new Date().getTime()) / 1000);
  $("#logoffTimeout").html(seconds);
}

// Create span to contain the timer
$(function(){
  $("#myForm\\:confirmDialog .ui-confirm-dialog-message").append("<span id=logoffTimeout/>");
});

XHTMLに埋め込まれたJavaScriptを使用していることに気づきました。その場合、CDATAXMLエラーが発生しないように追加します。

<script type="text/javascript">
//<![CDATA[
...
//]]>
</script>

キャッシュの利点を提供するファイル/リソースからスクリプトをロードすることをお勧めします。