單擊primefaces中的ESCAPE（ESC）時關閉所有對話框

Question

我正在使用4-5個primefaces對話框。當點擊ESC我想關閉所有打開的對話框。

Answer 1

通過使用widgetVar指定的客戶端對象調用對話框的hide()函數。所以，如果你確定你的p:dialog，如：

<p:dialog widgetVar="dialog1" header="Dialog 1"/> 
<p:dialog widgetVar="dialog2" header="Dialog 2"/> 

你的ESC鍵應該是這樣的：

<p:commandButton value="ESC" onclick="dialog1.hide();dialog2.hide()"/> 

你也可以創建一個可重用p:remoteCommand關閉所有對話框，並使用您的p:commandButton或p:hotkey - 如果通過「點擊ESCAPE」您的意思是hittig退出按鈕：

<p:remoteCommand name="closeAll" onsuccess="dialog1.hide();dialog2.hide()"/> 

然後在您的組件中參考t他closeAll()命令：

<p:hotkey bind="esc" handler="closeAll()"/> 
<p:commandButton value="ESC" onclick="closeAll()"/> 

Answer 2

雖然職位是舊的，但得到的答覆是相當靜態的解決方案，下面是一個動態的使用jQuery。

function escDialog() { 
    $(document).keyup(function(e) { 
     if (e.keyCode == 27) { // esc code is 27 
      closeAllDialog() ; 
     } 
    }); 
} 

function closeAllDialog() { 
    for (var propertyName in PrimeFaces.widgets) { 
    if (PrimeFaces.widgets[propertyName] instanceof PrimeFaces.widget.Dialog || 
     PrimeFaces.widgets[propertyName] instanceof PrimeFaces.widget.LightBox) { 
     PrimeFaces.widgets[propertyName].hide(); 
    } 
    } 
} 

然後在您的document.ready，你會打電話escDialog()

希望這有助於。