我正在使用 JSF 2.0 构建一个 webApp。我最近添加了一个 jQuery 对话框,它有一个取消和一个 OK 按钮,但无论我试图让它在按下 Enter 键时单击 OK 按钮,我都做不到。
对话框的 javascript 如下所示:
$("#goToPatientForm").dialog({
autoOpen: false,
height: 190,
width: 380,
modal: true,
resizable: false,
buttons: {
"Go": function() {
//CLICKS THE HIDDEN SAVE BUTTON SO IT CAN LOOK PRETTY.
//if(getMode()=="new"){
$('.goTo').click();
$(this).dialog( "close" );
},
Cancel: function() {
resetFormFields();
$(this).dialog( "close" );
}
},
close: function() {
resetFormFields();
//allFields.val("").removeClass("ui-state-error");
}
});
对话框如下所示:
<div id="goToPatientForm" title="Go To a Form">
<ul class="appnitro">
<li>
<h:outputLabel styleClass="description" for="pId">Patient Id: </h:outputLabel>
<div>
<h:inputText id="pId" value="#{dashboardBB.patientId}" size="30"></h:inputText>
</div>
</li>
<li style="visibility: hidden;">
<h:commandButton id="goToButton" action="#{dashboardBB.actionGoTo}" styleClass="goTo" value="Go" type="submit"></h:commandButton>
</li>
</ul>
</div>
如您所见,我已经给 OK 按钮一个 type="submit" 并且我什至在我的页面中添加了 javascript:
$("j_idt11:pId").keyup(function(event){
if(event.keyCode == 13){
alert("sometext");
$("j_idt11:goToButton").click();
}
});
但它不起作用,它只是重新加载页面,但它没有点击按钮的动作。任何想法为什么它不能那样工作?再次提前感谢!
图片:
编辑:这是呈现的 html
<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"><head><link type="text/css" rel="stylesheet" href="/miloWeb/faces/javax.faces.resource/theme.css?ln=primefaces-aristo" /><script type="text/javascript" src="/miloWeb/faces/javax.faces.resource/jquery/jquery.js?ln=primefaces&v=3.2"></script><script type="text/javascript" src="/miloWeb/faces/javax.faces.resource/primefaces.js?ln=primefaces&v=3.2"></script>
<title>MILO</title>
<link rel="stylesheet" type="text/css" href="/miloWeb/css/redmond/jquery-ui-1.8.11.custom.css" media="screen" />
<link rel="stylesheet" type="text/css" href="/miloWeb/css/style.css" media="screen" />
<link rel="stylesheet" type="text/css" href="/miloWeb/css/view.css" media="screen" />
<link rel="stylesheet" type="text/css" href="/miloWeb/css/ezmark.css" media="screen" />
<!--[if IE]>
<style type="text/css">
/* place css fixes for all versions of IE in this conditional comment */
.milo #content { zoom: 1; }
/* the above proprietary zoom property gives IE the hasLayout it may need to avoid several bugs */
</style>
<![endif]-->
<script type="text/javascript" src="/miloWeb/js/jquery.ezmark.js"></script>
<script type="text/javascript" src="/miloWeb/js/jquery.maskedinput.js"></script>
<script type="text/javascript" src="/miloWeb/js/random.js"></script>
<script type="text/javascript" src="/miloWeb/js/jquery-ui-1.8.11.custom.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$(".button").button();
});
function loading(){
$( "#loadingPopUp" ).dialog( "open" );
return false;
}
function unloading(){
$( "#loadingPopUp" ).dialog( "close" );
return false;
}
</script>
<script>
$(function() {
$("#dialog:ui-dialog").dialog("destroy");
$("#goToPatientForm").dialog({
autoOpen: false,
height: 190,
width: 380,
modal: true,
resizable: false,
buttons: {
"Go": function() {
//CLICKS THE HIDDEN SAVE BUTTON SO IT CAN LOOK PRETTY.
//if(getMode()=="new"){
$('.goTo').click();
$(this).dialog( "close" );
},
Cancel: function() {
resetFormFields();
$(this).dialog( "close" );
}
},
close: function() {
resetFormFields();
//allFields.val("").removeClass("ui-state-error");
}
});
$("#goToPopUp")
.click(function() {
$( "#goToPatientForm" ).dialog( "open" );
});
});
function resetFormFields(){
document.getElementById("j_idt11:pId").value = "";
}
</script></head><body class="milo">
<form id="j_idt11" name="j_idt11" method="post" action="/miloWeb/faces/pages/dashboard/dashboard.xhtml" class="miloForm" enctype="multipart/form-data">
<input type="hidden" name="j_idt11" value="j_idt11" />
<div id="container">
<div id="header"><html xmlns="http://www.w3.org/1999/xhtml"><body>
<div>
<h1 class="headerTitle">MILO Chart</h1>
<div class="headerTreadmark">Medical Information Leading Operations Chart</div>
<div class="clear"></div>
</div>
<div id="headerInfo"><table>
<tbody>
<tr><td></td></tr></tbody>
</table>
</div><div id="j_idt11:j_idt42"></div><script id="j_idt11:j_idt42_s" type="text/javascript">PrimeFaces.cw('AjaxStatus','widget_j_idt11_j_idt42',{id:'j_idt11:j_idt42'});widget_j_idt11_j_idt42.bindCallback('ajaxStart',function(){loading();});widget_j_idt11_j_idt42.bindCallback('ajaxSuccess',function(){unloading();});</script></body>
</html>
</div>
<div id="sidebar1"><div>
<h3 style="margin-top: 40px;">Navigation</h3>
<div id="navigation">
<ul class="top-level">
<li>
<script type="text/javascript" src="/miloWeb/faces/javax.faces.resource/jsf.js?ln=javax.faces"></script>
<a id="j_idt11:linkLogin" href="#" onclick="mojarra.jsfcljs(document.getElementById('j_idt11'),{'j_idt11:linkLogin':'j_idt11:linkLogin'},'');return false">Log Out</a></li>
<li><a id="j_idt11:linkDashboard" href="#" onclick="mojarra.jsfcljs(document.getElementById('j_idt11'),{'j_idt11:linkDashboard':'j_idt11:linkDashboard'},'');return false">Dashboard</a></li>
<li><a id="j_idt11:linkScheduler" href="#" onclick="mojarra.jsfcljs(document.getElementById('j_idt11'),{'j_idt11:linkScheduler':'j_idt11:linkScheduler'},'');return false">Scheduler</a></li>
<li>
<ul class="sub-level">
<li></li>
<li></li>
<li></li>
<li></li>
</ul>
</li>
<li>
<ul class="sub-level">
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
</ul>
</li>
<li>
<ul class="sub-level">
<li></li>
<li></li>
<li></li>
</ul>
</li>
<li></li>
</ul>
<h3 style="margin-top: 40px;">Opened Encounter</h3>
<div id="navigation2">
<ul class="top-level">
<li></li>
<li></li>
<li>
<ul class="sub-level">
<li></li>
<li></li>
<li></li>
<li></li>
</ul>
</li>
<li></li>
<li></li>
<li>
<ul class="sub-level">
<li></li>
<li></li>
<li></li>
<li></li>
</ul>
</li>
<li></li>
</ul>
</div>
</div>
</div>
<!-- end #sidebar1 -->
</div>
<br />
<br />
<div id="content">
<div id="goToPatientForm" title="Go To a Chart">
<ul class="appnitro">
<li><label for="j_idt11:pId" class="description">
Patient Id: </label>
<div><input id="j_idt11:pId" type="text" name="j_idt11:pId" size="30" />
</div>
</li>
<li style="visibility: hidden;"><input id="j_idt11:goToButton" type="submit" name="j_idt11:goToButton" value="Go" class="goTo" />
</li>
</ul>
<p class="validateTips">Type in the Patient Id of the chart you wish to open.</p>
</div>
<h2>Dashboard</h2>
<div>
<center>
<table cellspacing="0" cellpadding="3" width="520" style="position: relative; top: 100px;">
<tr>
<td align="center"><a id="j_idt11:linkLoginDash" href="#" onclick="mojarra.jsfcljs(document.getElementById('j_idt11'),{'j_idt11:linkLoginDash':'j_idt11:linkLoginDash'},'');return false"><img src="/miloWeb/images/schedulerIcon1.1.png" alt="Scheduler" /></a></td>
<td align="center"><a id="j_idt11:link2" href="#" onclick="mojarra.jsfcljs(document.getElementById('j_idt11'),{'j_idt11:link2':'j_idt11:link2'},'');return false"><img src="/miloWeb/images/newIcon1.1.png" alt="New Patient" /></a></td>
<td align="center"><a id="j_idt11:link3" href="#" onclick="jsf.util.chain(this,event,'return false;','mojarra.jsfcljs(document.getElementById(\'j_idt11\'),{\'j_idt11:link3\':\'j_idt11:link3\'},\'\')');return false"><img src="/miloWeb/images/goToIcon1.1.png" alt="Go To Patient" id="goToPopUp" /></a></td>
<td align="center"><a id="j_idt11:link4" href="#" onclick="mojarra.jsfcljs(document.getElementById('j_idt11'),{'j_idt11:link4':'j_idt11:link4'},'');return false"><img src="/miloWeb/images/searchIcon1.1.png" alt="Search screen" /></a></td>
<td align="center"><a id="j_idt11:link5" href="#" onclick="mojarra.jsfcljs(document.getElementById('j_idt11'),{'j_idt11:link5':'j_idt11:link5'},'');return false"><img src="/miloWeb/images/settingsIcon1.2.png" alt="Settings" /></a></td>
</tr>
<tr>
<td align="center">Scheduler</td>
<td align="center">New</td>
<td align="center">Go To</td>
<td align="center">Search</td>
<td align="center">Settings</td>
</tr>
</table>
</center>
</div>
</div>
<br class="clear" />
<div id="footer"><div id="template_footer_id" style="text-align: center;">© 2012 Bravo Technologies.
</div>
</div>
</div><input type="hidden" name="javax.faces.ViewState" id="javax.faces.ViewState" value="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" autocomplete="off" />
</form></body>
</html>