Surfaces Pressing Enter executes commandButton

Question

I work with perforations, and I have the following problem: I have a toolbar with several buttons and components, such as inputtext and others in the form, but when I press the Enter key in some component, the first button on the toolbar, in this case The "idButtomNuevo" command button is called because it is in the first position.

My code is:

almacen.xhtml

<ui:composition xmlns="http://www.w3.org/1999/xhtml" xmlns:h="http://java.sun.com/jsf/html" xmlns:f="http://java.sun.com/jsf/core" xmlns:ui="http://java.sun.com/jsf/facelets" xmlns:p="http://primefaces.org/ui" > <h:form id="idFormAlmacen" > <p:focus context="idFormAlmacen"/> <p:growl id="growl" showDetail="true" life="2500" for="keyAlmacen" globalOnly="true"/> <p:panel header="Almacen" styleClass="texto-panel"/> <ui:include src="/pages/logistica/almacen/toolbar_almacen.xhtml"/> <ui:include src="#{almacenBean.pathbodyAlmacen}" /> </h:form> <ui:include src="/pages/logistica/almacen/dialogos_almacen.xhtml" /> </ui:composition> 

toolbar_almacen.xhtml

 <ui:composition xmlns="http://www.w3.org/1999/xhtml" xmlns:h="http://java.sun.com/jsf/html" xmlns:f="http://java.sun.com/jsf/core" xmlns:ui="http://java.sun.com/jsf/facelets" xmlns:p="http://primefaces.org/ui"> <p:toolbar> <p:toolbarGroup align="left" styleClass="panelgrid-css"> <p:commandButton id="idButtomNuevo" title="Nuevo" icon="ui-icon-document" process="@this" value="Nuevo" actionListener="#{almacenBean.limpiarAlmacen}" update="idFormAlmacen" immediate="true"> <p:resetInput target="idFormAlmacen"/> </p:commandButton> <p:commandButton id="idButtomGuardar" title="Guardar" icon="ui-icon-disk" action="#{almacenBean.guardarAlmacen}" disabled="#{almacenBean.au.btGuardarDisabled}" update=":idFormAlmacen" validateClient="true" value="Guardar"/> <p:commandButton id="idButtomEliminar" title="Eliminar" icon="ui-icon-trash" actionListener="#{almacenBean.eliminarAlmacen}" disabled="#{almacenBean.au.btGuardarDisabled}" update="idFormAlmacen" process="@this" immediate="true" value="Eliminar"/> <p:commandButton id="idButtomListar" title="Listar" icon="ui-icon-grip-solid-horizontal" process="@this" value="Listar" actionListener="#{almacenBean.listarAlmacen}" update="idFormAlmacen" immediate="true"/> <p:commandButton id="idButtomBuscar" title="Buscar" icon="ui-icon-search" value="Buscar" actionListener="#{almacenBean.buscarAlmacen}" immediate="true"> <p:ajax event="dialogReturn" update="idFormAlmacen"/> </p:commandButton> </p:toolbarGroup> </p:toolbar> </ui:composition> 

pathbodyAlmacen = "/pages/logistica/almacen/crear_almacen.xhtml"

 <ui:composition xmlns="http://www.w3.org/1999/xhtml" xmlns:h="http://java.sun.com/jsf/html" xmlns:f="http://java.sun.com/jsf/core" xmlns:ui="http://java.sun.com/jsf/facelets" xmlns:p="http://primefaces.org/ui" > <p:panel header="Datos Generales de Almacen" /> <h:panelGrid id="idPanelAlmacen1" columns="3" width="100%" border="0" columnClasses="colC1-T,colC2-T"> <p:outputLabel for="idEmpresa" value="Empresa:" style="margin-right:2px;"/> <p:inputText id="idEmpresa" style="width:350px;" value="#{almacenBean.alVista.strEmpresa}" readonly="true"/> <h:outputText value="&#160;&#160;&#160;"/> <p:outputLabel for="idCodProveedor" value="Codigo:" style="margin-right:2px;"/> <p:inputText id="idCodProveedor" value="#{almacenBean.alVista.codigo}" style="width:350px;" required="true" requiredMessage="Ingrese Codigo "> <p:clientValidator /> </p:inputText> <p:message for="idCodProveedor" display="text"/> <p:outputLabel for="idNombre" value="Nombre:" style="margin-right:2px;"/> <p:inputText id="idNombre" value="#{almacenBean.alVista.nombre}" style="width:350px;" required="true" requiredMessage="Ingrese Nombre de Almacen"> <p:clientValidator event="keyup" /> </p:inputText> <p:message for="idNombre" display="text"/> </h:panelGrid> <h:panelGrid id="idPgDirAlmacen" columns="4" width="100%" border="0" columnClasses="colC1-T,colC2-T,colC3"> <p:outputLabel for="idInDirAlmacen" value="Direccion de Almacen:" style="margin-right:2px;" /> <p:inputText id="idInDirAlmacen" style="width:350px;" readonly="true" required="true" value="#{almacenBean.alVista.direccionAlmacen}" requiredMessage="Ingrese direccion de Almacen"/> <p:commandButton title="Crear Direccion Almacen" actionListener="#{almacenBean.abrirDireccionAlmacen}" process="@this" icon="ui-icon-search" > <p:ajax event="dialogReturn" update=":idFormAlmacen:idPgDirAlmacen"/> </p:commandButton> <p:message for="idInDirAlmacen" display="text"/> </h:panelGrid> </ui:composition> 

thanks for all

Answer 1

I had the same problem in my project. To avoid pressing the enter key, I just liked the following. In each inputText field this code is added,

 onkeypress="if (event.keyCode == 13) { return false; }" 

Answer 2

This is not JSF-specific behavior; when you press Enter , the first <input> with type="submit" . This has been discussed on SO (see this or this ), I will give some of the suggestions from these threads.

Solution for Javascript:

Use <h:form id="thisform" onkeypress="if( event.keyCode == 13){event.keyCode=0;}"> in your form. This, however, will not allow you to have any default command on the form, as it catches pressing Enter .

Vertex solution:

Use a dummy button in the form that does nothing, and set it as the default form.

 <p:defaultCommand target="dummy"/> <p:commandButton id="dummy" process="@none" global="false" style="display:none;"/> 

Answer 3

Try this attribute on an element:

 onkeypress="if (event.keyCode == 13) { this.blur(); return false; }"