porque no me funciona la libreria jquery cuando utilizo ajax

pithon · #1 (**permalink**) 08/05/2012, 14:54

Hola, os comento el problema que tengo haber si me podeis ayudar, trata de un codigo donde llamo llamo a un script php mediante ajax, este script que contiene un formulario dodne tengo dos campos que me los tendria que validar ya que utilizo la libreria jquery y su plugin validation, pero no me funciona, muestro codigo:

este es el script donde cargo las funciones php y la libreria jquery:

Código Javascript:

Ver original<html>
    <head>
<script type="text/javascript" src="jquery/jquery-1.4.2.js"></script>
<script type="text/javascript" src="jquery/jquery.validate.js"></script>
<script type="text/javascript" src="js/reglas_validacion_publicar.js"></script>
 
<script type='text/javascript'>
   function formulario() {
       var Ajax=obtiene_http_request();
           Ajax.open("post","formulario.php", true);
           Ajax.onreadystatechange = function() {
                if (Ajax.readyState == 4 && (Ajax.status == 200 || Ajax.status == 501)){
                    document.getElementById('contenido').innerHTML=Ajax.responseText;
                 }
           }
        Ajax.send(null);
     }
</script>
    </head>
    <body>
 
<div id='contenido'>
    <input type='button' value='tus datos' onclick='formulario();'>
</div>
    </body>
</html>

aqui el script que llamo con ajax(osea el formulario)

formulario.php

Código PHP:

Ver original<form id='form' method='post' action='procesarDatos.php'>
    <label>nombre</label><input type='text' name='nombre'><br><br>
    <label>email</label><input type='text' name='email'><br>
    <input type='submit' value='enviar'>
</form>

lo que tendria que hacerme es validarme con ajax los campos del formulario pero no me funciona, si coloco todo el codigo en el mismo script si que me funciona, a que es debido esto, alguna ayuda.

saludos.

Heiroon · #2 (**permalink**) 08/05/2012, 15:26

Cuando dices:

Cita:

si coloco todo el codigo en el mismo script si que me funciona.

Quieres decir que llamas los javascripts dentro de formulario.php?

pithon · #3 (**permalink**) 08/05/2012, 16:09

Hola Heiroon, me refiero que si coloco todo el codigo dentro de un mismo script osea cargar los js en el mismo codigo que el formulario, entonces si que me los valida los campos, pero de esta forma si llamo al formulario con ajax no me los valida es como si no estubieran los js, alguna idea de que puede ser, saludos

kikeking1 · #4 (**permalink**) 09/05/2012, 01:51

No veo por ninguna parte del codigo donde haces la llamada a la llamada a la validacion ( $("#form").validate(); ).

Supongo que en algun lado la tendras si no no te funcionaria al meter todo el codigo en el mismo documento.

Tu problema reside en que llamas al plugin (seguramente) cuando termina de cargarse el documento (con la recurrida $(function(){ ... }); ) pero la realidad es que cuando cargas la pagina, el formulario no existe (ya que se generará dinamicamente al cargarlo con ajax mas tarde) por lo que la sentencia $("#form").validate(); , no encuentra ningun id form en el documento y no hace nada (cuando metes todo el codigo como si esta, pos si funciona).

Solución: añade $("#form").validate();, despues del responseText (es decir una vez que el formulario este insertado en el dom de la pagina)

Código:

<script type='text/javascript'>
   function formulario() {
       var Ajax=obtiene_http_request();
           Ajax.open("post","formulario.php", true);
           Ajax.onreadystatechange = function() {
                if (Ajax.readyState == 4 && (Ajax.status == 200 || Ajax.status == 501)){
                    document.getElementById('contenido').innerHTML=Ajax.responseText;
$("#form").validate();
                 }
           }
        Ajax.send(null);
     }
</script>

Si no fuera ese tu problema, comentanos de nuevo y vemos que puede ser.

pithon · #5 (**permalink**) 09/05/2012, 04:18

Hola kikeking1, la llamada al plugin validation la hago desde esta linea:

Código HTML:

Ver original<script type="text/javascript" src="js/reglas_validacion_publicar.js"></script>

Creo que si que tienes toda la razon el problema la tengo donde dices, pero si le añado la linea de codigo a la funcion js osea la linea esta:

Código Javascript:

Ver original$("id").validate();

luego en el archivo que tengo las reglas de validacion que tendria que cambiar si tengo algo asin:

Código Javascript:

Ver original$(document).ready(function(){
    $("#form").validate({
 
       /*aqui todas las reglas*/
 
    })
})

Yo pense en meter el script de las reglas dentro de una funcion y llamar a esta funcion cuando invoco el formulario, pero no se que manera seria la mejor alguna idea?

saludos.

pithon · #6 (**permalink**) 09/05/2012, 04:28

Hola kikeking1, exacto ese era el problema, gracias al final hice lo que comentastes arriba pero metiendo las reglas dentro de una funcion e invocarlas cuando llamo al formulario.

Un saludo.

jofelrup · #7 (**permalink**) 12/06/2012, 10:16

Cita:

Iniciado por pithon

al final hice lo que comentastes arriba pero metiendo las reglas dentro de una funcion e invocarlas cuando llamo al formulario.

Buen día amigo, disculpa la ignorancia, tengo el mismo problema que tenías y como veo que ya lo solucionaste me atrevo a pedirte que compartas el ejemplo de como incluyes las reglas dentro de una función y su invocación cuando llamas al formulario.

Saludos cordiales

José Ruiz