JavaScript - propiedad style

propiedad style

Publicado por Aritz (12 intervenciones) el 30/01/2007 16:18:24

Tengo los siguientes scripts, pero no me oculta y me muestra los div's como yo quiero. el div principal trabaja correctamente, pero el de estado nunca aparece. Alguien podria decirme en que estoy fallando?

Tengo una página PHP que me muestra la información, es un resumen de la estructura para que no os volvais locos con la información:

<body>
<div id='cabecera'>
</div>
<div id="cuerpo">
<div id="menu">

</div>
<div id="principal">
</div>
<div id="estado">
</div>
<div id="basura">
</div>
</div>
</body>

Un fichero Javascript, con varias funciones, donde la clave está en las dos siguientes:

function showLeds (originalRequest)
{
var i, principal, aux, estado;
principal = $("principal");
principal.style.visibility = "hidden";
estado = $("estado");
estado.style.visibility = "show";
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>";
principal.innerHTML = aux;
}

function showResponse(originalRequest)
{
var principal, estado;
estado=$("estado");
estado.style.visibility="hidden";
principal = $("principal");
principal.style.visibility="show";
principal.innerHTML = originalRequest.responseText;
}

Valora esta pregunta

Me gusta: Está pregunta es útil y esta clara

No me gusta: Está pregunta no esta clara o no es útil

Responder

RE:propiedad style

Publicado por weirdmix (185 intervenciones) el 30/01/2007 17:51:33

si no mal recuerdo esta linea: estado.style.visibility = "show";
deberia ser asi: estado.style.visibility = "visible";

intenta cambiar a ver si funciona.

Valora esta respuesta

Me gusta: Está respuesta es útil y esta clara

No me gusta: Está respuesta no esta clara o no es útil

Comentar

RE:propiedad style

Publicado por Aritz (12 intervenciones) el 31/01/2007 11:01:46

Ya he probado con, esa opcion, pero tampoco funciona. También he probado a usar el metodo display y me sigue sin funcionar. Me muestra siempre lo que hay en principal, teniendo oculto el estado, y cuando quiero que me muestre el estado no funciona. En definitiva, yo quiero que en el div estado un objeto que se actualiza periodicamente (leds) este trabajando, para que cuando lo haga visible tenga la información actualizada. En este momento el objeto se va actualizando, pero cuando le pido que se muestre no lo muestra.

Aquí dejo el código javascript usando el metodo display:
/*
Abre la URL definida como parametro
*/
function ir(info,id)
{
var ajax, url;
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';
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";
principal.innerHTML = originalRequest.responseText;
}

function irBin(info, id)
{
var url, ajax, principal, estado;
if (info == 100)
{
ajax.stop();
}
else
{
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;
principal = $("principal");
principal.style.display = "none";
estado = $("estado");
estado.style.display = 'block';
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, estado;
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';
if (originalRequest.responseText == 1)
{
simulacionSwitch();
}
else
{
$("principal").innerHTML ="Error en el cambio de switch";
}
}

function simulacionSwitch()
{
var info,id, estado;
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.visibility = 'block';
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";
}

}

Valora esta respuesta

Comentar

RE:propiedad style

Publicado por Aritz (12 intervenciones) el 31/01/2007 11:20:40

Otra cosa que también estoy probando, es usar una función para mostrar y ocultar 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';
}
}

y luego en todas las funciones anteriores poner lo siguiente en vez de las definiciones de los div, y el atributo style

mostrarEstado(0); //si quiero ocultar el div estado

mostrarEstado(1); //si quiero mostrar el div estado (solo en showLeds)

Aún así no me funciona, la información se sigue actualizando correctamente, pero cuando me tiene que mostrar estado la pantalla aparece sin informacion.

Gracias

Valora esta respuesta

Comentar

RE:propiedad style

Publicado por Gonzalo (107 intervenciones) el 31/01/2007 12:33:09

Prueba con
$("estado").style.display = "";

O si prefieres, ya que parece que estás usando prototypejs, puedes utilizar
Element.show("estado");
para mostrarlo y
Element.hide("estado");
para ocultarlo.

Valora esta respuesta

Comentar

crear archivo xls en php

Duda con checkbox