JSF: ¿cómo enviar el formulario cuando se presiona la tecla enter?

Question

parece ser un requisito simple, pero no han encontrado una solución simple pero:

En una JSF 1.2/RichFaces 3,3 webapp, tengo una forma con componentes de entrada de varios tipos, seguido de un <a4j:commandButton> y un <h:commandButton>. El primero restablece el formulario, el segundo realiza alguna acción con los datos ingresados.

Mi objetivo es activar esta acción cuando el usuario presiona la tecla enter mientras ingresa datos. ¿Cómo puedo hacer eso?

Editar: En general, tengo más de un <h:commandButton> por <form>. Me gustaría designar uno en particular como acción predeterminada. Además, me gustaría que la solución funcione bien con AJAX (que utilizamos ampliamente).

Answer 1

En retrospectiva, la solución de este problema con el medio HTML proporciona es mucho menos frágil y más fácil de mantener, ya que las respuestas a la demostración siguiente pregunta relacionada:

Multiple submit buttons on HTML form – designate one button as default

Answer 2

A menos que esté utilizando el navegador MSIE y, en realidad, solo tiene un campo de entrada sin un botón, simplemente debería ser el comportamiento predeterminado. De lo contrario, probablemente algún código JS (generado automáticamente) lo haya estropeado.

Si usted no tiene áreas de texto en forma, una solución fácil sería la siguiente:

<h:form onkeypress="if (event.keyCode == 13) submit();"> 

O si tiene áreas de texto y no desea repetir las mismas funciones keypress sobre todo no -textarea input elements, ejecuta la siguiente secuencia de comandos durante la carga de la ventana.

for (var i = 0; i < document.forms.length; i++) { 
    var inputs = document.forms[i].getElementsByTagName('input'); 

    for (var j = 0; j < inputs.length; j++) { 
     inputs[j].onkeypress = function(e) { 
      e = e || window.event; 
      if (event.keyCode == 13) { 
       this.form.submit(); 
       return false; 
      } 
     }; 
    } 
} 

Answer 3

Sobre la base de la respuesta de BalusC me ocurrió la siguiente (probado en IE y Firefox):

<h:form id="form" onkeypress="ifEnterClick(event, #{rich:element('searchButton')});"> 

donde ifEnterClick se define por:

/** 
* Handler for onkeypress that clicks {@code targetElement} if the 
* enter key is pressed. 
*/ 
function ifEnterClick(event, targetElement) { 
    event = event || window.event; 
    if (event.keyCode == 13) { 
     // normalize event target, so it looks the same for all browsers 
     if (!event.target) { 
      event.target = event.srcElement; 
     } 

     // don't do anything if the element handles the enter key on its own 
     if (event.target.nodeName == 'A') { 
      return; 
     } 
     if (event.target.nodeName == 'INPUT') { 
      if (event.target.type == 'button' || event.target.type == 'submit') { 
       if (strEndsWith(event.target.id, 'focusKeeper')) { 
        // inside some Richfaces component such as rich:listShuttle 
       } else { 
        return; 
       } 
      } 
     } 
     if (event.target.nodeName =='TEXTAREA') { 
      return; 
     } 

     // swallow event 
     if (event.preventDefault) { 
      // Firefox 
      event.stopPropagation(); 
      event.preventDefault(); 
     } else { 
      // IE 
      event.cancelBubble = true; 
      event.returnValue = false; 
     } 

     targetElement.click(); 
    } 
} 

Editar: Desde seleccionar un valor de la finalización automática de formulario de Firefox utilizando la tecla Intro desencadena un evento de pulsación de tecla, pero no es preferible el evento de pulsación de tecla, mediante onkeypress, en onkeydown.

Answer 4

Sólo hay que poner este código en tu archivo JS:

$('input,textarea').live('keydown',function(e) { // submit forms on pressing enter while focus is on any input elmnt inside form 
    if (e.keyCode == 13) { 
     $(this).closest('form').submit(); 
    } 
}); 

Answer 5

utilizar el componente PrimeFaces:

<!-- Default button when pressing enter --> 
<p:defaultCommand target="submit"/> 

¡Úselo en combinación con un componente de enfoque y se balanceará!

<!-- Focus on first field, or first field with error --> 
<p:focus context="feesboek"/>