Tema: Loader mientras consulto datos....
Ver Mensaje Individual
  #1 (permalink)  
Antiguo 06/10/2009, 12:22
Avatar de bacdavi
bacdavi
 
Fecha de Ingreso: junio-2006
Ubicación: http://localhost/
Mensajes: 351
Antigüedad: 18 años, 9 meses
Puntos: 7
Pregunta Loader mientras consulto datos....
hola amigos!

He realizado un mi script para realizar una consulta a la base de datos a traves de un archivo *.php, y todo funciona a la perfección.

Perooo...

Necesito que mientras estoy consultado los datos en la BD que me muestre un loader.

les dejo mi codigo a ver si me pueden ayudar!

Código HTML: 
Ver original
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3. <head>
  4. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  5. <title>.::Envio de datos ajax::.</title>
  6. <script language="JavaScript" type="text/javascript">
  7. function display_data(mid,terminal) { 
  8.     xmlhttp=GetXmlHttpObject();
  9.     if (xmlhttp==null) {
  10.         alert ("Su navegador no soporta AJAX, Por favor utilice una version mas reciente del navegador");
  11.         return;
  12.     } 
  13.     mid=document.getElementById(mid).value;
  14.     ter=document.getElementById(terminal).value;    
  15.     var url="process.php";
  16.     url=url+"?mid="+mid+"&terminal="+ter;
  17.     xmlhttp.onreadystatechange=function() {
  18.         if (xmlhttp.readyState==4 || xmlhttp.readyState=="complete") {
  19.             document.getElementById('resultado').innerHTML=xmlhttp.responseText;
  20.         }
  21.     }
  22.     xmlhttp.open("GET",url,true);
  23.     xmlhttp.send(null);
  24.    return false;
  25. }
  26. function GetXmlHttpObject() {
  27.     var xmlhttp=null;
  28.     try {
  29.         // Firefox, Opera 8.0+, Safari
  30.         xmlhttp=new XMLHttpRequest();
  31.     }
  32.     catch (e) {
  33.         // Internet Explorer
  34.         try {
  35.             xmlhttp=new ActiveXObject("Msxml2.XMLHTTP");
  36.         }
  37.         catch (e) {
  38.             xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  39.         }
  40.     }
  41.     return xmlhttp;
  42. }
  43. </script>
  44. </head>
  45.  
  46. <body>
  47. <form onSubmit="return display_data('mid','terminal')">
  48. <table style="width: 50%; text-align: left; margin-left: auto; margin-right: auto;" border="0" cellpadding="2" cellspacing="2">
  49.   <tbody>
  50.     <tr>
  51.       <td>Afiliación:</td>
  52.       <td><input type="text" name="TXTmid" id="mid"/></td>
  53.     </tr>
  54.     <tr>
  55.       <td>Terminal:</td>
  56.       <td><input type="text" name="TXTterminal" id="terminal"/></td>
  57.     </tr>
  58.     <tr>
  59.       <td colspan="2" rowspan="1" align="center"><input type="submit" value="Enviar" name="BTNenviar" /></td>
  60.     </tr>
  61.   </tbody>
  62. </table>
  63. </form>
  64. <div id="resultado"></div>
  65. </body>
  66. </html>