crear eventos personalizados en javascript

djmon84 · #1 (**permalink**) 07/12/2009, 15:50

Hola!

Me he creado una clasecilla en javascript para manejar más comodamente los ajax. Pero quiero crearme un evento 'personalizado' para cuando haya cargado la información correctamente, tipo así:

Código :

Código:

var consulta = new Ajax('miURLdeconsulta.php?adf=df'); 
consulta.oncargado('hago lo que quiero con la info devuelta del ajax');

la clase que he creado es así:

Código:

function Ajax(url) 
{ 
   this.datos; 
   var ajax = getAJAX();//llama una función que devuelve el objeto xmlhtttprequest dependiendo si estas en IE o FF 
   ajax.onreadystatechange = resultado; 
   ajax.open(GET, url, true); 
   ajax.send();    
   this.evento; 
   function resultado() 
   { 
      if(ajax.readyState == 4) 
      { 
         this.datos = ajax.responseText;  
                // Lanzamos los eventos para decir que la información ha llegado ya y todo va ok 
          //IE 
         if(document.createEventObject) 
         { 
            this.evento = this.createEventObject(); 
            this.fireEvent('oncargado',this.evento);    
         } 
         //FF 
         else 
         { 
            this.evento = this.createEvent('Events'); 
            this.evento.initEvent('oncargado',true,false); 
            this.dispatchEvent(this.evento); 
         } 
      } 
   } 
}

En teoría creo que he hecho todo bien, porque lanzo los eventos de un modo u otro según el navegador que sea, pero no me funciona para usarlo así:

Código:

consulta.oncargado('hago lo que quiero con la info devuelta del ajax');

¿Alguien me hecha un cable?

gracias!

masterojitos · #2 (**permalink**) 07/12/2009, 16:03

podrias hacerlo cambiando tu codigo por algo asi quizas:

var ajax={
init:function(){
//.........
},
oncargardo:function(){
//.........
}
};

suerte.

Panino5001 · #3 (**permalink**) 07/12/2009, 22:20

Me parece que te estás complicando demasiado. Creo que esto es más flexible:

Código PHP:

  <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />

<title>ttt</title>

<script>

function Ajax(url,onCargado){

 
this.ajax = (XMLHttpRequest)?new XMLHttpRequest():new ActiveXObject('Microsoft.XMLHTTP'); 

this.ajax.onreadystatechange=function(){

    if(this.readyState==4){

        onCargado(this.responseText);

    }

}

this.ajax.open("GET",url, true);

this.ajax.send(null);

}

onload=function(){

    new Ajax('log.txt',function(r){document.getElementById('log').innerHTML=r;});

}

</script>

</head>

 
<body>

<div id="log"></div>

</body>

</html>

djmon84 · #4 (**permalink**) 08/12/2009, 04:49

pufffffffff, genial muchísimas gracias, funciona deliciosamente

Me apabulla ver lo que me queda de aprender y mejorar en javascript

De nuevo gracias!