Hola amigos estoy haciendo un calendario en php
pero para que el usuario no recargue toda la pagina le agues un script de ajax
de este site
http://www.w3schools.com/Ajax/ajax_database.asp
Código:
//aqui donde invoco el calendario
<body>
<table width="300" border="1" cellpadding="0" cellspacing="0">
<tr>
<td>
<img src="logos_publicaciones_index.jpg" width="347" height="255" />
</td>
<td>
<div id="some_obj">
<div id="txtHint">
<?php
include_once('calendario.php');
?>
</div>
</div>
</td>
</tr>
</table>
</div>
</body>
y este es el ajax que aplique
Código:
var xmlhttp
function showCustomer(mesSel,anoSel)
{
xmlhttp=GetXmlHttpObject();
if (xmlhttp==null)
{
alert ("Your browser does not support AJAX!");
return;
}
var url="calendario.php";
//url=url+"?q="+str;
url=url+"?month="+mesSel;
url=url+"&year="+anoSel;
//url=url+"&sid="+Math.random();
xmlhttp.onreadystatechange=stateChanged;
xmlhttp.open("GET",url,true);
xmlhttp.send(null);
}
function stateChanged()
{
if (xmlhttp.readyState==4)
{
flobu.disable();
document.getElementById("txtHint").innerHTML=xmlhttp.responseText;
}
}
function GetXmlHttpObject()
{
if (window.XMLHttpRequest)
{
// code for IE7+, Firefox, Chrome, Opera, Safari
return new XMLHttpRequest();
}
if (window.ActiveXObject)
{
// code for IE6, IE5
return new ActiveXObject("Microsoft.XMLHTTP");
}
return null;
}
ahora todo funciona bien, lo que no puedo aplicar es una imagen que aparesca
sobre el calendario mientras este esta cargando para eso quise utilizar este
loading
http://plugins.jquery.com/project/flower_bubble
aqui un ejemplo:
http://ok.ryotic.de/flobu_demo/
usando los botones podras ves lo que deseo usar
ahora bien quise aplicarlo esitando el ajax quedando asi
Código:
var xmlhttp
function showCustomer(mesSel,anoSel)
{
xmlhttp=GetXmlHttpObject();
if (xmlhttp==null)
{
alert ("Your browser does not support AJAX!");
return;
}
var url="calendario.php";
//url=url+"?q="+str;
url=url+"?month="+mesSel;
url=url+"&year="+anoSel;
//url=url+"&sid="+Math.random();
xmlhttp.onreadystatechange=stateChanged;
xmlhttp.open("GET",url,true);
xmlhttp.send(null);
}
function stateChanged()
{
if (xmlhttp.readyState==1)
{
flobu.enable()
}
else
{
if (xmlhttp.readyState==4)
{
flobu.disable();
document.getElementById("txtHint").innerHTML=xmlhttp.responseText;
}
}
}
function GetXmlHttpObject()
{
if (window.XMLHttpRequest)
{
// code for IE7+, Firefox, Chrome, Opera, Safari
return new XMLHttpRequest();
}
if (window.ActiveXObject)
{
// code for IE6, IE5
return new ActiveXObject("Microsoft.XMLHTTP");
}
return null;
}
donde agregue las funciones
flobu.enable();
flobu.disable();
y el resultado es que si funciona pero el loading se queda siempre visible y el calendar si cambia
la funcion flobu.disable(); no se ejecuyta que estara mal o que se debe hacer
saludos
espero sus comentario amigos