soy nuevo en ajax... este codigo funciona si le quito los parametros a las funciones de dejo solo el parametro url... pero el problema es que asi siempre me carga en el mismo cuadro y yo quiero mandarle por parametro en que cuadro quiero que cargue...
les dejo el codigo:
Código HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Cuadros</title>
<Script>
function toggle(what) {
var aobj = document.getElementById(what);
if( aobj.style.display == 'none' ) {
aobj.style.display = '';
} else {
aobj.style.display = 'none';
}
}
function CrearXMLHttp(){
XMLHTTP=false;
if(window.XMLHttpRequest){
return new XMLHttpRequest();
}else if(window.ActiveXObject){
return new ActiveXObject("Microsoft.XMLHTTP");
}
}
// suponiendo que tu div se llama loading
function OpenPage(url,id){
req=CrearXMLHttp();
if(req){
req.onreadystatechange = manejador(id);
req.open("POST",url,true);
req.send(null);
toggle('loading'); // ojo aqui
}
}
function manejador(id){
if(req.readyState == 4){
if(req.status == 200){
toggle('loading'); // ojo aca
document.getElementById(id).innerHTML=req.responseText;
}else{
alert("Error"+req.statusText)
}
}
}
function cargacuadro(id){
var donde = document.getElementById("url").value;
var url = "ajaxtest.php?id="+donde;
OpenPage(url,id);
}
</Script>
</head>
<body>
<p>Codigo:
<label>
<input name="url" type="text" id="url" value="" size="10" maxlength="10" />
</label>
Cuadro: <a href="#" onclick="cargacuadro('1');">1</a> <a href="#" onclick="cargacuadro('2');">2</a> <a href="#" onclick="cargacuadro('3');">3</a> <a href="#" onclick="cargacuadro('4');">4</a></p>
<table width="100%" border="1">
<tr>
<td id="tdc_1"><div id="loading" style="display:none;" align="left">
<table width="50" border="1" style="border-collapse:collapse;">
<tr>
<td bgcolor="#FF0000"><span style="color:#FFFFFF; font-weight:bold;">Cargando...</span></td>
</tr>
</table>
</div></td>
<td id="tdc_2"><div id="loading" style="display:none;" align="left">
<table width="50" border="1" style="border-collapse:collapse;">
<tr>
<td bgcolor="#FF0000"><span style="color:#FFFFFF; font-weight:bold;">Cargando...</span></td>
</tr>
</table>
</div></td>
</tr>
<tr>
<td id="tdc_3"><div id="loading" style="display:none;" align="left">
<table width="50" border="1" style="border-collapse:collapse;">
<tr>
<td bgcolor="#FF0000"><span style="color:#FFFFFF; font-weight:bold;">Cargando...</span></td>
</tr>
</table>
</div></td>
<td id="tdc_4"><div id="loading" style="display:none;" align="left">
<table width="50" border="1" style="border-collapse:collapse;">
<tr>
<td bgcolor="#FF0000"><span style="color:#FFFFFF; font-weight:bold;">Cargando...</span></td>
</tr>
</table>
</div></td>
</tr>
</table>
</body>
</html> no me funciona.. me tira un error... que dice 'no implementado' en la linea 27 caracter 3