Foros del Web » Programando para Internet » Jquery »

Evitar ENTER en formulario

Estas en el tema de Evitar ENTER en formulario en el foro de Jquery en Foros del Web. Hola tengo un pequeño programa que sirve para crear facturas hecho con Jquery y PHP. En cada campo el usuario ingresa datos y luego pulsa ...
  #1 (permalink)  
Antiguo 10/01/2019, 14:49
 
Fecha de Ingreso: mayo-2003
Mensajes: 523
Antigüedad: 21 años, 7 meses
Puntos: 6
Evitar ENTER en formulario

Hola tengo un pequeño programa que sirve para crear facturas hecho con Jquery y PHP.
En cada campo el usuario ingresa datos y luego pulsa ENTER, donde llamo un archivo PHP vía Ajax que hace alguna tarea y luego muevo el foco al próximo campo.
Al principio tenía el problema de que al presionar ENTER se me enviaba el formulario, lo cual solucioné agregando return false; a las funciones.
Todo funciona muy bien excepto cuando el archivo PHP demora un poco en hacer su tarea. Por ejemplo tengo un campo donde el usuario ingresa un texto y un archivo PHP busca los artículos que contengan ese texto. Como son muchos hay una pequeña demora. Yo muestro una leyenda que dice Cargando... para que el usuario sepa que tiene que esperar, pero el problema viene si el usuario se impacienta y presiona otro ENTER. Ahí se me envía todo el formulario y me causa problemas.
Este es el INPUT donde el usuario ingresa el texto:

Código HTML:
<input name="txtayuda" type="text" id="5" tabindex="4" onKeyPress="javascript:mostrar_help(this.value, event);" size="16" maxlength="16"> 
Como ven llamo a la función mostrar_help la cual evalúa si la tecla presionada es un ENTER y en ese caso llama al archivo PHP que busca los artículos:

Código:
 function mostrar_help(cadena, event)
	      {
		  var keyCode = ('which' in event) ? event.which : event.keyCode;	   		  
	      if (keyCode==13)	   		
		     {	
			 	 
			 if(cadena!='')
		        {
				
		 	    $('#contenedor_lsthelp').html('Cargando...');
				$('#5').attr('disabled','disabled');
		 	    $.ajax(
			       {
			 	   url:'procesar.php',
				   data: 'cadena_envio='+cadena,
				   success: function(resp)
				      {
				      $('#contenedor_lsthelp').html(resp);						
					  $('#8').focus();
					  $('#5').removeAttr('disabled');
				      }
		 		   });
		        }
		 	 else
		        {
			    $('#3').focus();
		        }				
		     }
			 
			 return false;		
		  }

Como ven uso return false; para evitar el envío del formulario. También intenté deshabilitar el INPUT mientras se produce la llamada Ajax: $('#5').attr('disabled','disabled');
Ninguna de las dos cosas me da resultado, si el usuario presiona otro ENTER durante la llamada Ajax el formulario se envía.

Bueno espero haber podido explicar mi problema y que me cuenten cómo lo resuelven ustedes.

Desde ya muchas gracias.
  #2 (permalink)  
Antiguo 11/01/2019, 16:07
Avatar de Triby
Mod on free time
 
Fecha de Ingreso: agosto-2008
Ubicación: $MX->Gto['León'];
Mensajes: 10.106
Antigüedad: 16 años, 4 meses
Puntos: 2237
Respuesta: Evitar ENTER en formulario

Prueba a desactivar el botón submit y reactivarlo cuando se complete la llamada AJAX.

Por otra parte, no es recomendable usar solo números para id de elementos, deberían comenzar con letra.
__________________
- León, Guanajuato
- GV-Foto

Etiquetas: enter, formulario
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 22:14.