Cargador en mi ajax

[salbatore]

Hola, foreros:

Tengo un cogido de ajax, el cual carga en un div contenido. Lo que busco es que entre carga y carga se muestre un cargador, es decir, que muestre un gif hasta que complete la carga...

¿Se puede?

El codigo es este:

Código PHP:

  // Documento JavaScript
// Esta función cargará las paginas
function llamarasincrono(url, id_contenedor){
var pagina_requerida = false
if (window.XMLHttpRequest) {// Si es Mozilla, Safari etc
pagina_requerida = new XMLHttpRequest()
} else if (window.ActiveXObject){ // pero si es IE
try {
pagina_requerida = new ActiveXObject("Msxml2.XMLHTTP")
} 
catch (e){ // en caso que sea una versión antigua
try{
pagina_requerida = new ActiveXObject("Microsoft.XMLHTTP")
}
catch (e){}
}
}
else
return false
pagina_requerida.onreadystatechange=function(){ // función de respuesta
cargarpagina(pagina_requerida, id_contenedor)
}
pagina_requerida.open('GET', url, true) // asignamos los métodos open y send
pagina_requerida.send(null)
}
// todo es correcto y ha llegado el momento de poner la información requerida
// en su sitio en la pagina xhtml
function cargarpagina(pagina_requerida, id_contenedor){
if (pagina_requerida.readyState == 4 && (pagina_requerida.status==200 || window.location.href.indexOf("http")==-1))
document.getElementById(id_contenedor).innerHTML=pagina_requerida.responseText
} 
   

¿Me ayudais?

[GatorV]

Hola salbatore,

Busca en el foro, es un tema que ya se ha tratado, y consiste en manejar los eventos en tu función onreadystatechange (que en tu caso es la función cargarpagina), para mostrar y ocultar el div.

Saludos.

[pato12]

Prueba haci:

Código HTML:

// Documento JavaScript 
// Esta función cargará las paginas 
function llamarasincrono(url, id_contenedor){ 
var pagina_requerida = false 
if (window.XMLHttpRequest) {// Si es Mozilla, Safari etc 
pagina_requerida = new XMLHttpRequest() 
} else if (window.ActiveXObject){ // pero si es IE 
try { 
pagina_requerida = new ActiveXObject("Msxml2.XMLHTTP") 
}  
catch (e){ // en caso que sea una versión antigua 
try{ 
pagina_requerida = new ActiveXObject("Microsoft.XMLHTTP") 
} 
catch (e){} 
} 
} 
else 
return false 
pagina_requerida.onreadystatechange=function(){ // función de respuesta 
cargarpagina(pagina_requerida, id_contenedor) 
} 
pagina_requerida.open('GET', url, true) // asignamos los métodos open y send 
pagina_requerida.send(null) 
} 
// todo es correcto y ha llegado el momento de poner la información requerida 
// en su sitio en la pagina xhtml 
function cargarpagina(pagina_requerida,id_contenedor){
if (pagina_requerida.readyState==4){
if (pagina_requerida.status==200){
document.getElementById(id_contenedor).innerHTML=pagina_requerida.responseText;
}else{
document.getElementById(id_contenedor).innerHTML=.innerHTML="Error...";
}
}else{
document.getElementById(id_contenedor).innerHTML=.innerHTML="Cargando...";
}
}

Suerte
Salu2

[guiweb]

estimado AJAX tiene 4 estados, el numero 1 es para LOADING ;) eso te dice algo mira...

if (xmlHttp.readyState==1){
mostrar('cargador');
}
if (xmlHttp.readyState==4){
//document.getElementById("span_mod_usuarios").inner HTML=xmlHttp.responseText;
//mostrar('div_mod_usuarios');
buscar_usuarios();
ocultar('cargador');
}
}

yo lo que hice fue crear un <DIV id="cargador"> que tiene dentro el Gif Animado y un texto,
SALUDOS ;)

[salbatore]

Hola de nuevo...

He probado el codigo que me ha escrito pato12 y no me funciona, simplemente con ese ajax no se muestran los datos al clicar... jeje

El problema es que no se mucho sobre ajax, pero mas o menos con la vuestra ayuda he podido hacer practicamente una web bastante chula con algo de ajax, y lo unico que me faltaba era poner cargadores... pero no se tanto como para ponerlo yo, jeje...

¿Soy un pesado?

[rodrigo_lopez]

agrega esto:

if (pagina_requerida.readyState==1){
document.getElementById(id_contenedor).innerHTML = "cargando... y una imagen =P ";
}


antes de if (pagina_requerida.readyState==4){

y despues de la funcion:
function cargarpagina(pagina_requerida,id_contenedor){

[salbatore]

Hola...

Muchisimas gracias rodrigo_lopez... tu codigo funciona super bien, jeje...

Muchas gracias a todos...