Ok.
En mi archivo general.js
Código PHP:
var globalCallbacks = {
onCreate: function(){$('status').style.display = 'block';},
onComplete : function(){
if (Ajax.activeRequestCount == 0){
$('status').style.display = 'none';
}
}
};
En el HEADER de mi archivo ejem.php
Código PHP:
<header>
<script type="text/javascript" src="prototype.js"></script>
<script type="text/javascript" src="general.js"></script>
<script language="javascript" type="text/javascript">
Ajax.Responders.register(globalCallbacks);
</script>
</header>
Ahora en ese mismo archivo pongo un div ..... lo hago despuesito del body, pero realmente puede ir en cualquier parte del body ya que la disposición la controlo con CSS.
Código PHP:
<div class="msgStatus" id="status"><center><img src='/site/img/ajax-loader.gif' border='0' align='absmiddle'> Procesando tu solicitud.</center></div>
Y finalmente el archivo CSS con la clase que hace posible su ubicación y aspecto.
Código PHP:
.msgStatus {
position: fixed;
top: 1px;
right:1px;
border: 1px solid #FEEB9D;
background-color: #FEEB9D;
color: #333333;
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:12px;
width: auto;
height: auto;
display:none;
}
Y listo, puede parecer muy simple pero logro asegurarme siempre del momento definitivo en que finaliza mi petición por AJAX.
Ahora, con esto solo controlo el encendido y apagado de mi indicador de progreso pero se pueden hacer mucho más cosas... que ya estoy desarrollando.
Un saludo