Ver Mensaje Individual
  #1 (permalink)  
Antiguo 26/08/2011, 12:12
Avatar de RonaldNet
RonaldNet
 
Fecha de Ingreso: mayo-2009
Mensajes: 31
Antigüedad: 15 años, 7 meses
Puntos: 0
Pregunta Problema con Jquery y AJAX

Saludos Foreros... nuevamente recurro a ustedes (que me salvaron varias veces)
Resulta que soy nuevo en JQuery y Ajax y no hallo la forma de hacer correctamente la validación del lado del cliente con Ajaxy Jquery
Tengo el siguiente formulario con 4 campos y un boton de enviar
Código PHP:
Ver original
  1. <form method="post" action="envio.php" id="myform" name="myform" >
  2.       <fieldset id="form">
  3.         <legend>Send Email</legend>
  4.         <ol>
  5.             <li><label>Name:</label><input type="text" size="30" name="fname" class="required" minlength="5" /></li>
  6.             <li><label>E-mail:</label><input type="text" size="30" name="femail" class="required" /></li>
  7.             <li><label>Phone:</label><input type="text" size="30" name="fphone" class="required" /></li>
  8.             <li><label>Comments:</label><textarea name="fcomment" rows="5" cols="25" class="required" ></textarea></li>
  9.         </ol>
  10.         <p align="center">
  11.         <input type="submit"  id="enviar" name="mysubmit" value="Enviar" />
  12.         </p>
  13.       </fieldset>
  14. </form>
  15. <div id="loading" style="display: none;"></div>
  16. <div id="result" style="display: none;"></div>//aqui deberia aparecer el resultado de "envio.php" pero no aparece :/
hasta ahí todo bien, el problema surje a la hora de validar el formulario usando un plugin para Jquery "jquery.validate.min.js". el código es el siguiente:
Código Javascript:
Ver original
  1. <script language="javascript" src="jquery-1.3.min.js"></script>
  2. <script language="javascript" src="jquery.validate.min.js"></script>
  3. <script language="javascript">
  4. $('document').ready(function(){
  5.     if($('#myform').validate() == TRUE){
  6.         $('#myform').submit(function(evento){
  7.             evento.preventDefault(); // para cancelar el evento por defecto del formulario
  8.             $('#loading').css('display', 'block'); //muestro un mensaje o una imagen de "cargando"
  9.             $.post($('#myform').attr('action'), $('#myform').serialize(), function(respuesta){ //envio el formulario y recibo una respuesta ajax
  10.                 $('#result').css('display', 'block');
  11.                 $('#result').html(respuesta);
  12.                 $('#loading').css('display', 'none');
  13.             });
  14.         });
  15.     }
  16. });
  17. </script>
la validación la hace correctamente usando la class required (no se completa el submit del formulario es decir no envia los datos a envio.php) el problema es el siguiente:
una vez insertando los datos del formulario correctamente parece no estar usando AJAX por que me muestra los resultados de "envio.php" en otra página y no en la misma página "index.php" (debajo del formulario) que es donde deberia aparecer
aqui les dejo el resultado [URL="http://ministeriorocaeternalp.com/ronald/email/"]http://ministeriorocaeternalp.com/ronald/email/[/URL]
espero que me haya dejado entender y por favor NECESITO SU AYUDAA muchas gracias...