Estoy usando Ajax para crear una aplicacion web. Para ello tengo 2 div's
de información. Uno se llama principal y otro estado. En principal
aparece toda la información general, menos la única que aparece en
estado (un objeto ajax que se actualiza cada segundo). La cosa es que
quiero que cuando hago click en mostrar Inputse me oculte el div
principal, y me muestre el div estado. Para hacer esto uso el siguiente
código:
/* Manejador de la inicialización de la página*/
function handler()
{
ir('1','');
irBin('7','INPUTS');
mostrarEstado(1);
}
/*Muestra el div estado*/
function mostrarEstado(ctr)
{
var estado, principal;
estado = $("estado");
principal = $("principal");
if ( ctr == 1 )
{
principal.style.display = 'none';
estado.style.display = 'block';
}
else
{
estado.style.display = 'none';
principal.style.display = 'block';
}
}
/*
Abre la URL definida como parametro
*/
function ir(info,id)
{
var ajax, url, estado;
if(info == 1)
{
mostrar('');
}
param = 'param='+info+'&identificador='+id;
url = "http://10.0.7.59/html/SimulacionPHP/handler.php";;
ajax = new Ajax.Request (url,
{
method:
'get',
parameters: param,
onLoading: showProgress,
onComplete: showResponse
});
}
/*Muestra una barra de progreso para decir que está cargando la
información*/
function showProgress()
{
/*var principal, estado;
estado = $("estado");
estado.style.diplay = 'none';
principal = $("principal");
principal.style.display = 'block';*/
var principal;
principal = $("principal");
mostrarEstado(0);
principal.innerHTML = "<div class='info'><img
src='./imagenes/ajax-loader-1.gif' alt='Barra de progreso' title='Barra
de progreso'></div>";
}
/* Muestra la respuesta AJAX en el campo que el usuario desea*/
function showResponse(originalRequest)
{
/*var principal, estado;
estado = $("estado");
estado.style.display = 'none';
principal = $("principal");
principal.style.display = 'block';*/
var principal;
principal = $("principal");
mostrarEstado(0);
principal.innerHTML = originalRequest.responseText;
}
function irBin(info, id)
{
var url, ajax, principal, estado;
if (info == 100)
{
ajax.stop();
}
else
{
/*principal = $("principal");
princiapl.style.display = 'none';
estado = $("estado");
estado.style.display = 'block';*/
param = 'param='+info+'&identificador='+id;
url = "http://10.0.7.59/html/SimulacionPHP/handler.php";;
myDiv = $('basura');
myDiv.style.visibility = "hidden";
ajax = new Ajax.PeriodicalUpdater (
myDiv,
url,
{
method:
'get',
frequency: 1,
parameters: param,
onSuccess: showLeds
});
}
}
function showLeds (originalRequest)
{
/*var i, principal, aux, estado;*/
/*var estado;
estado = $("estado");
mostrarEstado(1);*/
res = originalRequest.responseText;
aux = "";
for (i = 0; i < 16; i++)
{
if (res[i] == 0)
{
aux = aux + "<img src='./imagenes/green-off.gif' />";
}
else
{
if(res[i] == 1)
{
aux = aux + "<img src='./imagenes/green-on.gif'
/>";
}
}
}
aux = aux + "<form ><input type=submit onsubmit='irBin(100,10)'
value='Parar Actualización'/></form>";
estado.innerHTML = aux;
}
function cambiarSwitch()
{
var id, info;
info = 9;
id= "OUTPUT";
param = 'param='+info+'&identificador='+id;
url = "http://10.0.7.59/html/SimulacionPHP/handler.php";;
ajax = new Ajax.Request (url,
{
method:
'get',
parameters: param,
onComplete: cargarSwitch
});
}
function cargarSwitch(originalRequest)
{
/*var principal, estado;
estado = $("estado");
estado.style.display = 'none';
principal = $("principal");
principal.style.display = 'block';*/
var principal;
principal = $("principal");
mostrarEstado(0);
if (originalRequest.responseText == 1)
{
simulacionSwitch();
}
else
{
principal.innerHTML ="Error en el cambio de switch";
}
}
function simulacionSwitch()
{
var info,id;
info = 8;
id= "OUTPUT";
param = 'param='+info+'&identificador='+id;
url = "http://10.0.7.59/html/SimulacionPHP/handler.php";;
ajax = new Ajax.Request (url,
{
method:
'get',
parameters: param,
onComplete: showSwitch
});
}
function showSwitch(originalRequest)
{
/*var state, principal, estado;
estado = $("estado");
estado.style.display = 'none';
state = originalRequest.responseText;
principal = $("principal");
principal.style.display = 'block';*/
var principal, state;
state = originalRequest.responseText;
principal = $("principal");
mostrarEstado(0);
if (state == 1)
{
principal.innerHTML = "<a onclick='cambiarSwitch()'><img
src='./imagenes/switchmediano2.png'></a>";
}
else
{
if(state == 2)
{
principal.innerHTML = "<a onclick='cambiarSwitch()'><img
src='./imagenes/switchmediano1.png'></a>";
}
else
principal.innerHTML = "ERROR";
}
}
El PHP:
<body>
<div id='cabecera'>
</div>
<div id="cuerpo">
<div id="menu">
<!-- Información del menú (Funciona)-->
</div>
<div id="principal">
</div>
<div id="estado">
</div>
<div id="basura">
</div>
</div>
</body>
El problema es que principal me lo muestra correctamente, pero aunque
recibo la informacion actualizada para esta, esta no sale por pantalla.
_______________________________________________
javaEScript mailing list
javaEScript@scriptia.net
http://lists.scriptia.net/listinfo.cgi/javaescript-scriptia.net
