Saltar al contenido

El formulario no se envía al presionar enter

Después de investigar con expertos en esta materia, programadores de deferentes ramas y profesores dimos con la respuesta a la cuestión y la plasmamos en esta publicación.

Solución:

Estaba luchando con este mismo problema; uno de mis formularios se estaba enviando al presionar “ingresar” en los campos de texto sin ningún problema; otro formulario similar en la misma página no se enviaría en absoluto, por mi vida.

Ninguno de los campos tenía un botón de envío, y tampoco estaba usando javascript para enviar ningún envío.

Lo que encontré es que cuando solo hay un campo de texto en un formulario, al presionar ‘ingresar’ en el campo de texto se enviará automáticamente; pero si hay más de un campo (entrada de texto regular (es decir, de una sola línea)), no hace nada, a menos que también haya algún tipo de botón ‘enviar’.

Aparentemente, esto es parte de la especificación HTML 2.0:

Cuando solo hay un campo de entrada de texto de una sola línea en un formulario, el agente de usuario debe aceptar Entrar en ese campo como una solicitud para enviar el formulario.

Una vieja discusión, pero aparentemente aún válida e interesante, aquí.

… evidentemente pretendía ser una forma conveniente de enviar consultas simples, pero reduciendo el riesgo, en un formulario complejo, de enviarlo prematuramente al intentar completarlo. Numerosos implementadores de navegadores (por ejemplo, Netscape, Opera, varias versiones de Lynx,. ..) siguió este consejo, aunque parece con interpretaciones ligeramente diferentes.

Hice un JSFiddle para demostrar. Por lo que puedo decir (perezosamente solo probando con Chrome), el formulario se enviará en “Entrar” si solo hay un campo de texto, o si hay un botón de envío, incluso si está oculto.

(EDITAR: más tarde descubrí que también parece funcionar si hay otros campos de entrada que no son una entrada de texto regular de una sola línea… por ejemplo, áreas de texto, selecciones, etc., gracias a @ user3292788 por esa información. Se actualizó el JSFiddle para reflejar esto).

Form with one text field only, no submit button

Seems to submit automatically when pressing 'enter' in the first text field

Form with two text fields, no submit button

Won't submit when pressing 'enter' in the forms ...

Form with two text fields and a submit button ...

Now it submits with 'enter' key

Form with two text fields and a HIDDEN submit button ...

Seems to work, even with submit hidden ...

Form with no action or method attribute, HIDDEN submit button ...

Even this seems to work.

Form with multiple fields, but only one text input, no submit button.

This seems to work as well.

Tienes dos opciones:

  1. Cree un controlador de eventos para el botón Intro y agréguelo a sus enlaces.
  2. Usa un en el formulario en algún lugar, que es lo que obtiene el comportamiento automático de la tecla Enter que está buscando.

También puede provenir de un enlace de javascript a un some info

Su botón Enter quedará atrapado en alguna parte por el return falsey su formulario no se enviará en Enter key. La forma correcta es especificar que el

y suelta el return false ha puesto allí para evitar que ese botón envíe un formulario. 😉

En aras del aprendizaje,