javascript no se carga en capa dinámica. Por qué?

[TorKilah]

Buenas!! Bueno, antes que nada, gracias por vuestro tiempo y, antes de preguntar aquí he googleado mucho. Solo que yo no soy programador, estoy aprendiendo por mi cuenta, y sobre lo que de momento he encontrado, hablan demasiado técnicamente para mis niveles. Jejeje, ahora, al lío:

Parte A - La cuestión es que tengo un index.php, y en esa página tengo una función con Ajax, que llama a otra página php (registro.php) dentro de una capa css (.contenedor) haciendo click a un botón (funciona)

Parte B - En el formulario de registro aplico un script para falidar el e-mail tal que así: (también funciona sin problemas. PERO SOLO EJECUTANDOLO EN REGISTRO.PHP)

Código (javascript) [Seleccionar] Expandir


<script type="text/javascript">
var f20 = new LiveValidation('#f20');
         f20.add( Validate.Email );
</script>


Parte C y problema en cuestión... Cuando en el index.php le doy click al botón, se carga dinámicamente el formulario de registro.php en el div.contenedor, peeeero... no funciona el script que valida el e-mail...:

He pensado que lo más probable es que sea alguna incompatibilidad... como que el script que se carga en registro.php se esté pegando con otro que haya en index.php pero no sabría por donde buscar... :S, tengo la última libreria jQuery-1.8.2

He probado también de cargar la librería del script del validador en el index... no se por que... supongo que por barajar posibilidades, ya os he dicho que no tengo ni papa... voy haciendo chino chano, hehe.

Este es el script que utilizo en el index.php para que se cargue registro.php dinámicamente.

Código (javascript) [Seleccionar] Expandir


<script type="text/javascript"">
var obj;

function generaPeticion(url) {
if (window.XMLHttpRequest) {
   // Obtener un nuevo objeto
   obj = new XMLHttpRequest();
   // Indicar la funcion de retorno
   obj.onreadystatechange = procesaRespuesta;
   // Método  GET con la url; "true" para asincronica
   obj.open("GET", url, true);
   // null for GET with native object
   obj.send(null);
 // IE/Windows ActiveX object
 
 } else if (window.ActiveXObject) {
   obj = new ActiveXObject("Microsoft.XMLHTTP");
   if (obj) {
     obj.onreadystatechange = procesaRespuesta;
     obj.open("GET", url, true);
     obj.send();
   }
 } else {
   alert("Su navegador no soporta AJAX");
 }
}

function procesaRespuesta() {

   if (obj.readyState == 4) {
         document.getElementById('contenedor').innerHTML = obj.responseText;
   }
}
</script>


Si falta algún dato decidme por favor!! creo haber expuesto lo necesario!!

[TorKilah]

Ninguna ideilla?!

[Valkyr]

Con que no funciona, ¿a qué te refieres? A que salta algún error por la consola, no hace nada...

No se que estarás usando para ir "depurando" lo que haces, así que si comentas un poco eso pues mejor que mejor. Tampoco estaría de más que pusieses el código completo de index y registro, para que así podamos ver todo lo que hay.

También, puesto que usas jQuery, te indico que puedes hacer uso de la función $.ajax({...}) que viene en el framework, en lugar de hacer las peticiones con el código que tienes, te lo digo más que nada porque con la función que proporciona jQuery tienes más opciones que quién sabe, quizás podrían interesarte.

Saludos.

[#!drvy]

Hola,

@TorKilah, mencionarte que esto es un foro no un chat. Apenas han pasado 3 horas desde que escribiste el post para volver a publicar "Ninguna ideilla?!"..  no esperes una respuesta tan rápido.

Normalmente, cuando cargas un script dinamicamente (osease, ajax) debes saber que es muy probable que deje de funcionar.  Eso pasa porque a la hora de cargar las funciones javascript el DOM todavía no ha sido alterado por el evento ajax. Por tanto para esas funciones, lo que cargas con el ajax es invisible.

Te recomiendo usar jQuery y su evento .live() que se encargara de procesar cualquier objeto existente o creado en un futuro (carga ajax.)

Aparte, estaría bien que depurases el código como te ha mencionado @Valkyr mediante el uso de la consola javascript que viene incluida en la mayoría de los navegadores.

PD: Java es un lenguaje diferente a javascript. El foro correcto para este tema seria Desarrollo Web.

Saludos

[TorKilah]

Hola!!! gracias por vuestras respuestas!!!

Al final lo solucioné de otra manera. Buscando, buscando, buscando y buscando, he ido leyendo cosas sobre la función .live() y que está desfasada, que no es muy recomendable y tal... entonces pensé... en la página b.php funciona bien el script, cuando cargo la página b.php en la a.php no se carga el script... omg...
Como lo podría hacer? pues bien, deduje que podría haber alguna manera de llamar a un script dinámicamente haciendo algún evento sobre algún objeto... y efectivamente, buscando más encontré la manera de hacer esto:

Siendo #registros la capa .css donde quiero cargar el formulario de la página b.php

Código (javascript) [Seleccionar] Expandir


 $('#registros').click(function ()
     {
       $.getScript("js/livval.js", function (data, estado)
     {
          if (estado == 'success')
          {
             var f20 = new LiveValidation('f20');
             f20.add( Validate.Email );
          }
          else
      {
         alert("Error. Inténtalo de nuevo");
          }
     });
     });


Que os parece?? creéis que habría alguna forma mejor de ejecutar este concepto? (seguro que la hay)

Y para el que se vea en mi situación, por lo menos ya tiene una forma preventiva de salir del apuro, hehehe.


***Aprender programación me está resultando altamente adictivo!!! huahuahua!!!***