Duda OnReadyStateChange

[@ndreX!]

Saludos. Tengo un pequeño dilema con esto, y es que tengo una funcion para hacer Busqueda con Ajax, un pequeño AutoCompletador o Sugerencias de Busqueda. Ahora bien, digamos que ya casi esta listo, pero tengo un problema, en mi PHP tengo un sleep de 5 segundos, para poder ver el famoso "Loading..." pero cuando hace la consulta, se bloquea mi browser, hasta que pasan los 5 segundos. ¿Exactamente adonde debería cambiar el display para que se me mostrara el "Loading.."?

La variable qu utilizo para el Loading es LoadingWait.

Código:

	function Search(idin,results,url,wait){
		inputSearch = document.getElementById(idin);
		DivResultto = document.getElementById(results);
		LoadingWait = document.getElementById(wait);
				
		if(inputSearch.value != '' && inputSearch.value.length > 1){
			ajax = objetoAjax();
			ajax.onreadystatechange=function() {
				if(ajax.readyState == 4){
					DivResultto.innerHTML 	  = ajax.responseText;
					LoadingWait.style.display = 'none';
					DivResultto.style.display = '';
				}
				else{
					LoadingWait.style.display = '';
					DivResultto.style.display = 'none';
				}

			}
			ajax.open("GET", url+inputSearch.value);
			ajax.send(null);
		}
		else{
			return false;
		}
	}

Y a tal función la llamo así:

Código HTML:

<form>
	<input type="text" onkeyup="Search(this.id, 'u', 'php/bgproc.php?searchid=', 'indicator1');" name="page" id="v" value="" />
	<span id="indicator1" style="display:none;"><img style="display: inline;" src="img/loader.gif" /></span>
</form>
<div id="u" class="autocomplete"></div> 

Nose si estaria bien esto, espero sus comentarios.

Saludos.

[Ansgar]

tambien estoy probando Ajax (soy principiante);

Creo tu server responde muy rapido ! y de seguro no te da tiempo para mostrar el "loading.." creo q no es bueno usar un sleep (por el server!)..

y si cambias

-------------------------------------------------------------------------

ajax.onreadystatechange=function() {

if(ajax.readyState == 4){
DivResultto.innerHTML = ajax.responseText;
LoadingWait.style.display = 'none';
DivResultto.style.display = '';
}else{
LoadingWait.style.display = "<img src='img/loadinng.gif' >Loading...";
}


}

--------------------------------------

no estoy seguro derrepnete funcione!

Suerte ...

[MaBoRaK]

loading.............


Debería quedar así.

Código PHP:

  function Search(idin,results,url,wait){ 
        var inputSearch = document.getElementById(idin); 
        var DivResultto = document.getElementById(results); 
        var LoadingWait = document.getElementById(wait); 
                 
        if(inputSearch.value != '' && inputSearch.value.length > 1){ 
            ajax = objetoAjax(); 
            ajax.onreadystatechange=function() { 
                if(ajax.readyState == 4){ 
                    DivResultto.innerHTML       = ajax.responseText; 
                    LoadingWait.style.display = 'none'; 
                    DivResultto.style.display = ''; 
                } 
            } 
            LoadingWait.style.display = ''; 
            DivResultto.style.display = 'none'; 
            ajax.open("GET", url+inputSearch.value); 
            ajax.send(null); 
        } 
        else{ 
            return false; 
        } 
    }  
   

Antes del open. y si crees que aun así es muy rápido.

Código PHP:

  function Search(idin,results,url,wait){ 
        var inputSearch = document.getElementById(idin); 
        var DivResultto = document.getElementById(results); 
        var LoadingWait = document.getElementById(wait); 
                 
        if(inputSearch.value != '' && inputSearch.value.length > 1){ 
            ajax = objetoAjax(); 
            ajax.onreadystatechange=function() { 
                if(ajax.readyState == 4){ 
                                 setTimeout(function(){ 
                    DivResultto.innerHTML       = ajax.responseText; 
                    LoadingWait.style.display = 'none'; 
                    DivResultto.style.display = ''; 
                                  },5000); 
                } 
            } 
            LoadingWait.style.display = ''; 
            DivResultto.style.display = 'none'; 
            ajax.open("GET", url+inputSearch.value); 
            ajax.send(null); 
        } 
        else{ 
            return false; 
        } 
    }  
   

connection closed.