1

I'm doing Primefaces 5.1. In my page use two commandButton Add,Edit button and username Text field. When I press enter in username text field script to perform editbutton click want perform.But it will perform addButton click.I try below code:

<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>

When I press enter in textfield it will not perform editbutton only trigger with first button that is addbutton.If I change position of button i.e editbutton is first it will perform editbutton.

2 Answers2

1

You can try with:

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

and:

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

See also:

Default action to execute when pressing enter in a form

Community
  • 1
  • 1
Zim
  • 1,457
  • 1
  • 10
  • 21
  • DefaultCommand is triiger work when I press any textbox to press enter key.But I want to specify textbox press enter to triggerWork –  Jun 09 '15 at 05:59
  • I try it (Primefaces 5.1) but same it only trigger first button(saveButton) performed –  Jun 09 '15 at 06:51
0

There are two issues in your code:
1. function name is callEvent, but you are using callerEvent with text field keyPress event.
2. id selector for editbutton is not correct to get element.

You can simply do it with jQuery like selector (ends-with) as following:

<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();    
});
Parkash Kumar
  • 4,710
  • 3
  • 23
  • 39