I am working with primefaces and I have the following problem, I have a toolbar with several buttons and components like inputtext and others in the form, but when I press the key Enter in some component the first button of the toolbar is called, in this case commandbutton "idButtomNuevo" is called because it is in the first position.
My code:
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="   "/>
<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
This is not a JSF specific behavior, when Enter is pressed the first <input>
with type="submit"
is used. This has been discussed on SO (see this or this), I'll put here some of the suggestions from those threads.
Javascript solution:
Use <h:form id="thisform" onkeypress="if( event.keyCode == 13){event.keyCode=0;}">
on your form. This, however, will prevent you from having any default command on the form since it catches pressing Enter.
Primefaces solution:
Use a dummy button on the form which does nothing, and set it as form's default command.
<p:defaultCommand target="dummy"/>
<p:commandButton id="dummy" process="@none" global="false" style="display:none;"/>