Foros del Web » Programando para Internet » Javascript » Frameworks JS »

Eventos en AJAX

Estas en el tema de Eventos en AJAX en el foro de Frameworks JS en Foros del Web. Bien yo voy poner esta pregunta aka y en lo topico del Javascript. Bien en javscript tenemos addEventLsitner. En navegador Firefox la version 3.6 tiene ...
  #1 (permalink)  
Antiguo 25/03/2010, 07:41
 
Fecha de Ingreso: marzo-2009
Ubicación: Santo André - São Paulo - Brasil
Mensajes: 91
Antigüedad: 15 años, 7 meses
Puntos: 1
Eventos en AJAX

Bien yo voy poner esta pregunta aka y en lo topico del Javascript.

Bien en javscript tenemos addEventLsitner. En navegador Firefox la version 3.6 tiene addEventListener para AJAX. Pero en outros navegadores no hay.

Entonces lo que me gustaria hacer crear lo evento. Pero yo no se como puedo crear lo evento. ex:
AJAX.addEventLsitener('load',function(){//hacealgo}),false);

esto és nativo en firefox la version 3.6 pero en todos los otros no entonces yo pense en utilizar-se de createEvent. Ahora viene la question es posible hacer esto y como yo hago???

ps: Yo utilizo Javascript Orientado a Objetos entonces tengo una classe en javascript para hacer Ajax. Estoy poniendo la classe caso desen utilizar y mirar. Quando la classe esta toda pronto yo tengo que hacer captura de los eventos es por isso la duvida.

Código Javascript:
Ver original
  1. function ajaxClass(URL,method,codePage,data,typeHeader){
  2.     var xmlhttp = "";
  3.     var contentType = new Array();
  4.     contentType[0] = 'text/xml';
  5.     contentType[1] = 'text/html';
  6.     contentType[2] = 'application/x-www-form-urlencoded';
  7.  
  8.     if(xmlHttpRequest){
  9.         xmlhttp = new xmlHttpRequest();
  10.     }else if(ActiveXObject("Microsoft.XMLHTTP")){
  11.         xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
  12.     }else if(ActiveXObject("MSXML2.XMLHTTP.3.0")){
  13.         xmlhttp = new new ActiveXObject("MSXML2.XMLHTTP");
  14.     }else{
  15.         alert("Your Browser Don't offer suport to AJAX");
  16.     }
  17.  
  18.     if(method == "GET"){
  19.         URL = URL+"?"+escape(data);
  20.         xmlhttp.open(method,URL,true);
  21.         xmlhttp.setRequestHeader('Content-Type',contentType[typeHeader]);
  22.         xmlhttp.setRequestHeader('encoding',codePage);
  23.         xmlhttp.send(null);
  24.     }else if(method == "POST"){
  25.         data = escape(data);
  26.         xmlhttp.open(method,URL,true);
  27.         xmlhttp.setRequestHeader('Content-Type',contentType[typeHeader]);
  28.         xmlhttp.setRequestHeader('encoding',codePage);
  29.         xmlhttp.setRequestHeader('Content-Type',contentType[2]);
  30.         xmlhttp.setRequestHeader('Content-length',data.length);
  31.         xmlhttp.send(data);
  32.     }else{
  33.         alert("Method not Defined.");
  34.     }
  35. }

Despues és solo utilizar-se de la classe como abajo
Código Javascript:
Ver original
  1. var AJAX = new ajaxClass("direcion.php","POST","UTF-8","lasvariables = las Informaciones&lasvariables2 = las Informaciones2",1);
  2. /*Ahora seria la parte que yo tengo que utilizar de listeners.*/
__________________
Exitem 11 tipos de personas. Las personas que comprendem binario. Y las personas que no comprende.

Tudo en la vida és sencillo o muy sencillo.
  #2 (permalink)  
Antiguo 25/03/2010, 11:20
 
Fecha de Ingreso: marzo-2009
Ubicación: Santo André - São Paulo - Brasil
Mensajes: 91
Antigüedad: 15 años, 7 meses
Puntos: 1
Respuesta: Eventos en AJAX

Cita:
Iniciado por flpms Ver Mensaje
Bien yo voy poner esta pregunta aka y en lo topico del Javascript.

Bien en javscript tenemos addEventLsitner. En navegador Firefox la version 3.6 tiene addEventListener para AJAX. Pero en outros navegadores no hay.

Entonces lo que me gustaria hacer crear lo evento. Pero yo no se como puedo crear lo evento. ex:
AJAX.addEventLsitener('load',function(){//hacealgo}),false);

esto és nativo en firefox la version 3.6 pero en todos los otros no entonces yo pense en utilizar-se de createEvent. Ahora viene la question es posible hacer esto y como yo hago???

ps: Yo utilizo Javascript Orientado a Objetos entonces tengo una classe en javascript para hacer Ajax. Estoy poniendo la classe caso desen utilizar y mirar. Quando la classe esta toda pronto yo tengo que hacer captura de los eventos es por isso la duvida.

Código Javascript:
Ver original
  1. function ajaxClass(URL,method,codePage,data,typeHeader){
  2.     var xmlhttp = "";
  3.     var contentType = new Array();
  4.     contentType[0] = 'text/xml';
  5.     contentType[1] = 'text/html';
  6.     contentType[2] = 'application/x-www-form-urlencoded';
  7.  
  8.     if(xmlHttpRequest){
  9.         xmlhttp = new xmlHttpRequest();
  10.     }else if(ActiveXObject("Microsoft.XMLHTTP")){
  11.         xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
  12.     }else if(ActiveXObject("MSXML2.XMLHTTP.3.0")){
  13.         xmlhttp = new new ActiveXObject("MSXML2.XMLHTTP");
  14.     }else{
  15.         alert("Your Browser Don't offer suport to AJAX");
  16.     }
  17.  
  18.     if(method == "GET"){
  19.         URL = URL+"?"+escape(data);
  20.         xmlhttp.open(method,URL,true);
  21.         xmlhttp.setRequestHeader('Content-Type',contentType[typeHeader]);
  22.         xmlhttp.setRequestHeader('encoding',codePage);
  23.         xmlhttp.send(null);
  24.     }else if(method == "POST"){
  25.         data = escape(data);
  26.         xmlhttp.open(method,URL,true);
  27.         xmlhttp.setRequestHeader('Content-Type',contentType[typeHeader]);
  28.         xmlhttp.setRequestHeader('encoding',codePage);
  29.         xmlhttp.setRequestHeader('Content-Type',contentType[2]);
  30.         xmlhttp.setRequestHeader('Content-length',data.length);
  31.         xmlhttp.send(data);
  32.     }else{
  33.         alert("Method not Defined.");
  34.     }
  35. }

Despues és solo utilizar-se de la classe como abajo
Código Javascript:
Ver original
  1. var AJAX = new ajaxClass("direcion.php","POST","UTF-8","lasvariables = las Informaciones&lasvariables2 = las Informaciones2",1);
  2. /*Ahora seria la parte que yo tengo que utilizar de listeners.*/
Bein yo creo que es demasiado dificil. Pero tambien yo no festoy haciendo la pregunta de la manera correcta.

Pero tambien buscando en la web. Para ser más exacto en la fuente de las documentaciones de cada navegador yo encontré las respuestas.

En navegadores con motores -webkit- no hay problemas com lo addEventListener para lo objeto XMLhttpRequest. Para los navegadores baseado en -Gecko tambien haga lo mismo. Pero en internet explorer tiene que utilizar-se del attachEvent. Yo solo mire los articulos pero no hizo ninguno teste entonces no es conclusivo.
__________________
Exitem 11 tipos de personas. Las personas que comprendem binario. Y las personas que no comprende.

Tudo en la vida és sencillo o muy sencillo.
  #3 (permalink)  
Antiguo 26/03/2010, 09:19
Avatar de Panino5001
Me alejo de Omelas
 
Fecha de Ingreso: mayo-2004
Ubicación: -34.637167,-58.462984
Mensajes: 5.148
Antigüedad: 20 años, 5 meses
Puntos: 834
Respuesta: Eventos en AJAX

La verdad no es la manera más ortodoxa, pero podrías intentar algo como esto:
Código:
<script>
function ajaxClass(URL,method,codePage,data,typeHeader){
    var xmlhttp ="";
    var contentType = new Array();
    contentType[0] = 'text/xml';
    contentType[1] = 'text/html';
    contentType[2] = 'application/x-www-form-urlencoded';
 
    if(typeof window.XMLHttpRequest!='undefined'){
        xmlhttp = new XMLHttpRequest();
    }else{ 
		try{
			
			 xmlhttp = new ActiveXObject('Microsoft.XMLHTTP');
		}catch(e){
			alert('Su navegador no soporta AJAX');
			return false;
		}
    }
 
    if(method == "GET"){
        URL = URL+"?"+escape(data);
        xmlhttp.open(method,URL,true);
        xmlhttp.setRequestHeader('Content-Type',contentType[typeHeader]);
        xmlhttp.setRequestHeader('encoding',codePage);
        xmlhttp.send(null);
    }else if(method == "POST"){
        data = escape(data);
        xmlhttp.open(method,URL,true);
        xmlhttp.setRequestHeader('Content-Type',contentType[typeHeader]);
        xmlhttp.setRequestHeader('encoding',codePage);
        xmlhttp.setRequestHeader('Content-Type',contentType[2]);
        xmlhttp.setRequestHeader('Content-length',data.length);
        xmlhttp.send(data);
    }else{
        alert("Method not Defined.");
    }
	this.xhr=xmlhttp;
	this.addEventListener=function(e,fn,u){
		var _this=this;
		if(_this.xhr.addEventListener)
			_this.xhr.addEventListener(e,fn,u);
		else{
			_this.xhr['on'+e]=function(){fn.call(_this.xhr,window.event);};
			
		}
	}
}
var AJAX = new ajaxClass("t.php","POST","UTF-8","&lasvariables=las Informaciones&lasvariables2=las Informaciones2",1);
AJAX.addEventListener('readystatechange',function(){if(this.readyState==4)document.body.innerHTML=this.responseText;},false);
</script>
  #4 (permalink)  
Antiguo 03/04/2010, 08:16
 
Fecha de Ingreso: marzo-2009
Ubicación: Santo André - São Paulo - Brasil
Mensajes: 91
Antigüedad: 15 años, 7 meses
Puntos: 1
Respuesta: Eventos en AJAX

Lo Listener no Funciona.
__________________
Exitem 11 tipos de personas. Las personas que comprendem binario. Y las personas que no comprende.

Tudo en la vida és sencillo o muy sencillo.
  #5 (permalink)  
Antiguo 03/04/2010, 08:22
Avatar de Panino5001
Me alejo de Omelas
 
Fecha de Ingreso: mayo-2004
Ubicación: -34.637167,-58.462984
Mensajes: 5.148
Antigüedad: 20 años, 5 meses
Puntos: 834
Respuesta: Eventos en AJAX

El ejemplo funciona. Lo que tendrías que modificar (yo lo dejé tal como lo tenías) es esta línea: URL = URL+"?"+escape(data);
Porque debes escapar sólo los valores, no los nombres de variable y sus separadores.

Última edición por Panino5001; 03/04/2010 a las 09:28
  #6 (permalink)  
Antiguo 03/04/2010, 08:41
Avatar de Panino5001
Me alejo de Omelas
 
Fecha de Ingreso: mayo-2004
Ubicación: -34.637167,-58.462984
Mensajes: 5.148
Antigüedad: 20 años, 5 meses
Puntos: 834
Respuesta: Eventos en AJAX

Lo del escapado puedes resolverlo así:
Código PHP:
<script>
function 
ajaxClass(URL,method,codePage,data,typeHeader){
    var 
xmlhttp ="";
    var 
contentType = new Array();
    
contentType[0] = 'text/xml';
    
contentType[1] = 'text/html';
    
contentType[2] = 'application/x-www-form-urlencoded';
 
    if(
typeof window.XMLHttpRequest!='undefined'){
        
xmlhttp = new XMLHttpRequest();
    }else{ 
        try{
            
             
xmlhttp = new ActiveXObject('Microsoft.XMLHTTP');
        }catch(
e){
            
alert('Su navegador no soporta AJAX');
            return 
false;
        }
    }
 
    if(
method == "GET"){
        var 
t=data.split('&');
        var 
p='';
        for(var 
i=0,l=t.length;i<l;i++){
            var 
t2=t[i].split('=');
            
p+='&'+t2[0]+'='+escape(t2[1]);    
        }
        
URL URL+"?"+p;
        
xmlhttp.open(method,URL,true);
        
xmlhttp.setRequestHeader('Content-Type',contentType[typeHeader]);
        
xmlhttp.setRequestHeader('encoding',codePage);
        
xmlhttp.send(null);
    }else if(
method == "POST"){
        var 
t=data.split('&');
        var 
p='';
        for(var 
i=0,l=t.length;i<l;i++){
            var 
t2=t[i].split('=');
            
p+='&'+t2[0]+'='+escape(t2[1]);    
        }
        
URL URL+"?"+p;
        
xmlhttp.open(method,URL,true);
        
xmlhttp.setRequestHeader('Content-Type',contentType[typeHeader]);
        
xmlhttp.setRequestHeader('encoding',codePage);
        
xmlhttp.setRequestHeader('Content-Type',contentType[2]);
        
xmlhttp.setRequestHeader('Content-length',data.length);
        
xmlhttp.send(data);
    }else{
        
alert("Method not Defined.");
    }
    
this.xhr=xmlhttp;
    
this.addEventListener=function(e,fn,u){
        var 
_this=this;
        if(
_this.xhr.addEventListener)
            
_this.xhr.addEventListener(e,fn,u);
        else{
            
_this.xhr['on'+e]=function(){fn.call(_this.xhr,window.event);};
            
        }
    }
}
var 
AJAX = new ajaxClass("t.php","GET","UTF-8","&lasvariables=las Informaciones&lasvariables2=las Informaciones2",1);
AJAX.addEventListener('readystatechange',function(){if(this.readyState==4)document.body.innerHTML=this.responseText;},false);

</script> 
De todas maneras no me parece buena idea el generar esos falsos listeners. Lo mejor es usar callbacks, de esta manera:
Código PHP:
<script>
function 
http(){
    if(
typeof window.XMLHttpRequest!='undefined'){
        return new 
XMLHttpRequest();    
    }else{
        try{
            return new 
ActiveXObject('Microsoft.XMLHTTP');
        }catch(
e){
            
alert('Su navegador no soporta AJAX');
            return 
false;
        }    
    }    
}
function 
requestCallbackParam(url,callback,params){
    var 
H=new http();
    if(!
H)return;
    
H.open('post',url+'?'+Math.random(),true);
    
H.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
    
H.onreadystatechange=function(){
        if(
H.readyState==4){
            
callback(H.responseText);
            
H.onreadystatechange=function(){}
            
H.abort();
            
H=null;
        }
    }
    var 
p='';
    for(var 
i in params){
        
p+='&'+i+'='+escape(params[i]);    
    }
    
H.send(p);
}

requestCallbackParam('t.php',function(r){document.body.innerHTML=r;},{'var1':1,'var2':'hola'});
</script> 

Etiquetas: ajax, eventos
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta

SíEste tema le ha gustado a 1 personas




La zona horaria es GMT -6. Ahora son las 07:48.