Primefaces热键在离开Dialog后仍在工作



我在Primefaces中使用热键时遇到困难。打开对话框后,我想在按下退出键后显示确认对话框。主要问题是,在离开对话框后,此Escape按钮仍在打开Confirmation对话框。有没有办法将这个热键只绑定到对话框?热键中有没有一些我没有使用的属性?这是主代码,取自另一个stackoverflow答案,不幸的是它没有正确这个问题。提前感谢

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:p="http://primefaces.org/ui"
xmlns:f="http://xmlns.jcp.org/jsf/core">
<h:head>
<title>PrimeFaces Check</title>
<style type="text/css">
</style>
</h:head>
<h:body> 
<h:form>
<h:outputText value="main content"/>
<br/>
<br/>
<br/>
<p:commandButton value="open Dialog"
onclick="PF('dlgEdit').show();" />


<!--        Primefaces Dialog    -->
<p:dialog id="dlgEdit" widgetVar="dlgEdit" width="500" height="500"
closeOnEscape="true" closable="false" modal="true">
<h:outputText value="dialog content"/>



<p:hotkey bind="esc" handler="PF('confirmClose').show();" />
</p:dialog>
<p:confirmDialog message="Do you want to save?" widgetVar="confirmClose" width="250" height="250">
<p:commandButton value="Yes"
oncomplete="PF('confirmClose').hide();PF('dlgEdit').hide();" />
<p:commandButton value="No" type="button"
onclick="PF('confirmClose').hide();PF('dlgEdit').hide();" />
</p:confirmDialog>      
</h:form>
</h:body>
</html>

我为这个问题开发了一个解决方案。这会给我一个例外还是不能正常工作?

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:p="http://primefaces.org/ui"
xmlns:f="http://xmlns.jcp.org/jsf/core">
<h:head>
<title>PrimeFaces Check</title> 
<h:outputScript library="primefaces" name="jquery/jquery.js" />
<style type="text/css">
</style>
</h:head>
<h:body> 
<h:form>
someinput 1
<p:inputText  onkeydown="keyEventFuerTabShiftOderNurTabImInput();"/>
<br/>
someinput 2
<p:inputText  onkeydown="keyEventFuerTabShiftOderNurTabImInput();"/>
<br/>
<br/>
<h:outputText value="main content"/>
<br/>
<br/>
<p:commandButton value="open Dialog" process="@this"
onclick="PF('dlgEdit').show();" />

<!--        Primefaces Dialog    -->
<p:dialog id="dlgEdit" widgetVar="dlgEdit" width="500" height="500"
closeOnEscape="false" closable="false" modal="true">
<h:outputText value="dialog content"/>
<p:ajax event="open" onstart="isDialogVisible('dlgEdit','confirmClose');"/>
</p:dialog>

<p:confirmDialog message="Do you want to save?" widgetVar="confirmClose" width="250" height="250">
<p:commandButton value="Yes"
oncomplete="PF('confirmClose').hide();PF('dlgEdit').hide();" />
<p:commandButton value="No" type="button"
onclick="PF('confirmClose').hide();" />
</p:confirmDialog>      

<p:remoteCommand name="remotecommand" process="@this"
onstart="PF('checkdialog').show();" />        

</h:form>
<script type="text/javascript">  
$(document).ready(function(){
keyEventFuerTabShiftImDialog();
});

function isDialogVisible(dialogId,confirmId){   
$(document).on('keyup', function(e) {
if (e.keyCode == 27){
var istDialogOpened = PF(dialogId).isVisible();
if(istDialogOpened){
PF(confirmId).show();
}
e.preventDefault();
}   
});
};
/* <![CDATA[ */
function keyEventFuerTabShiftOderNurTabImInput(){   
if(event.shiftKey && event.keyCode == 9) {
//primefaces remote command  here possible:                             
alert(("shift tab pressed"));
return false; 
}
else if(event.keyCode == 9) { 
//primefaces remote command  here possible:                             
alert(("tab pressed"));
return false; 
}
}
/* ]]> */

</script>
</h:body>
</html>

最新更新