Ver Mensaje Individual
  #3 (permalink)  
Antiguo 18/02/2014, 03:50
Avatar de satjaen
satjaen
 
Fecha de Ingreso: septiembre-2012
Ubicación: Jaén (Andalucía)
Mensajes: 893
Antigüedad: 11 años, 8 meses
Puntos: 10
Respuesta: Enviar formulario con evento onblur

Cita:
Iniciado por Alexis88 Ver Mensaje
Utiliza el método blur para detectar la pérdida del enfoque en el elemento y con el método trigger, disparas el evento submit en el formulario. Un pequeño ejemplo:

Código HTML:
Ver original
  1. <form id = "formulario" action = "ejemplo.php">
  2.     Dato: <input type = "text" name = "buscar" />
  3.     <input type = "submit" value = "Buscar" />
  4. </form>
  5.  
  6. <textarea id = "salida"></textarea>

Código Javascript:
Ver original
  1. $("#formulario").submit(function(e){
  2.     e.preventDefault();
  3.     $.ajax({
  4.         url: $(this).prop("action"),
  5.         data: $(this).serialize(),
  6.         success: function(response){
  7.             $("#salida").val(response);
  8.         }
  9.     });
  10. });
  11.  
  12. $("#salida").blur(function(){
  13.     $("#formulario").trigger("submit");
  14. });

En el <textarea> se visualizará la respuesta del servidor, es decir, el resultado del procesamiento del dato enviado desde el formulario mediante el método ajax.

Saludos

Gracias Alexis, pero si mando el formulario al terminar de escribir en el textarea con blur para que poner ?:

<input type = "submit" value = "Buscar" />


Con esto bastaría?

Código HTML:
Ver original
  1. <form id = "formulario" action = "ejemplo.php">
  2.    <textarea id = "salida"></textarea>
  3. </form>

Lo he intentado así pero no va:
Código Javascript:
Ver original
  1. <html xmlns="http://www.w3.org/1999/xhtml">
  2. <head>
  3. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  4. <script type="text/javascript" src="http://code.jquery.com/jquery-1.4.2.min.js"></script>
  5. <title>mi bug</title>
  6. </head>
  7. <script type="text/javascript" >
  8. $("#formulario").submit(function(e){
  9.     e.preventDefault();
  10.     $.ajax({
  11.         url: $(this).prop("action"),
  12.         data: $(this).serialize(),
  13.         success: function(response){
  14.             $("#contenido").val(response);
  15.         }
  16.     });
  17. });
  18.    $("#salida").blur(function(){
  19.     $("#formulario").trigger("submit");
  20. });
  21. </script>
  22. <body>
  23. <form id = "formulario" action = "ins1_avisos.php">
  24.   <table width="79%">
  25.             <tr>
  26.               <th scope="col" width="57">Teléfonos</th>
  27. <th scope="col" width="52"><input name="telefonos" id="telefonos"  type="text" size="9" maxlength="9"/></th>
  28.  
  29.              <th scope="col" width="46">Nombre</th>
  30.     <th scope="col" width="88"><input name="name" id="name" type="text" size="35"/>
  31.               </th>
  32.               <th scope="col" width="46">Apellidos</th>
  33.   <th scope="col" width="403"><input name="apellidos" id="apellidos" type="text" size="20" /></th>
  34.  
  35.     <th scope="col"><textarea id = "salida"></textarea></th>
  36.             </tr>
  37.            
  38.            
  39. </table>
  40. <input type="hidden" name="MM_insert" value="form1" />
  41.  
  42. </form>
  43. <div id="contenido"></div>
  44. </body>
  45. </html>


Última edición por satjaen; 18/02/2014 a las 07:05