Loading mientras carga...

humanista · #1 (**permalink**) 17/02/2012, 06:03

Hola, no sé si este post va aquí, sino, pueden moverlo...

El tema es que en mi web tengo que cargar muchos registros, meterlos en una tabla y sacarlos ordenados.

El tema es que todo el proceso tarda entre 10 y 20 segundos y por ello me gustaría poner un "loading...", es decir un icono o algo que se mueva para decirle que el sistema está cargando los datos.

Esto se puede hacer? dónde? cómo? (no es AJAX, es puro SQL con PHP)

ZeroZ · #2 (**permalink**) 17/02/2012, 06:23

Se me ocurre, que cuando se cargue el <body> aparezca el mensaje de "loading..." y tengas el div del contenido oculto y cuando termine tu consulta, llames a un javascript que el div del contenido lo ponga visible:

<body onLoad="ocultar()">

function ocultar(){
document.getElementById('tuDivLoading').style.disp lay = 'inline';
document.getElementById('tuDiv').style.display = 'none';
}

Cuando termine tus consultas, llama a un método javascript que cambie la propiedad display a document.getElementById('tuDiv').style.display = 'inline'; por ejemplo:

function mostrar(){
document.getElementById('tuDivLoading').style.disp lay = 'none';
document.getElementById('tuDiv').style.display = 'inline';
}

tuDivLoading es el div donde aparece el mensaje "Loading..."

bray · #3 (**permalink**) 17/02/2012, 06:49

Hola, como bien te ha dicho ZeroZ puedes hacerlo usando javascript de esa forma o también puede usar AJAX para la carga.

Te recomiendo que mires tutoriales de Ajax con el uso del Framework JQuey y podrás hacer eso que dices con tan solo una función sencilla, te dejo un enlace que puede servirte

http://www.grabthiscode.com/programa...agen-cargando/

y aqui un libro gratuito y libre de jquery si quieres profundizar

http://librojquery.com/

aunque tengas que tomar algo de tiempo para entender su uso, veras que a la larga te facilita mucho el trabajo y la carga de elementos de forma asíncrona (sin congelar la pagina).
Existen muchos framework de este tipo para JavaScript , mi recomendación es esta (JQuery), ya que hace mucho mas facil y simples los códigos.

un sauludo