Question

我在做Primefaces 5.1。在我的页面中使用两个commandButton Add，Edit按钮和用户名Text字段。当我按下输入用户名文本字段脚本执行编辑按钮时，单击想要执行。但是它将执行addButton click.I尝试下面的代码：

<h:head>
<script>
function callEvent(evnt)
{
if(event.keyCode==13)
{
$('editbutton').trigger('click');
}
</script>

</h:head>
<h:form>
<p:inputText id="userNameField" onkeyPress="callerEvent(event)"/>
.....
....
<p:commandButton id="addButton" value="Save" action="#{user.saveButton}"/>
<p:commandButton id="editbutton" value="Edit" action="#{user.editButton}"/>
</h:form>

当我在文本字段中按Enter键时，它不会执行editbutton只触发第一个按钮是addbutton.If我改变按钮的位置，即editbutton是第一个它将执行编辑按钮。

Answer 1

您可以尝试：

<h:form id="user-form">

和

<script>
   function callEvent(event) {
      if(event.keyCode==13) {
         $('#user-form\\:editbutton').click();
         return false;
      }
</script>

另见：

Default action to execute when pressing enter in a form

Answer 2

您的代码中存在两个问题：
1.函数名称为callEvent，但您正在使用callerEvent文本字段keyPress事件 2.编辑按钮的id选择器获取元素不正确。

您可以使用jQuery之类的选择器（ends-with）执行此操作，如下所示：

<p:inputText id="userNameField" />

$("input[id$='userNameField']").on('keypress', function(event) {
    var keycode = event.keyCode ? event.keyCode : event.which;
    if(keycode == '13')
        $("input[id$='editbutton']").get(0).click();    
});

Primefaces onkeyPress triggerevent

2 个答案: