[SOLUCIONADO] DIsplay none dependiendo del valor de un select al cargar la pagina

olimpico10 · #1 (**permalink**) 01/06/2018, 17:03

Muy buenas,

les comento el problema que tengo. Necesito que, dependiendo del valor seleccionado de un select se muestren o no ciertos inputs del formulario. Esto lo consigo ya despues de cargar la página cada vez que se cambia el valor del select con el evento onchange, esta es una parte que necesito y que ya está funcionando. Pero también necesito que, al cargar la página, dependiendo del valor que venga seleccionado en el select, se muestren o no los otros inputs, sin tener que cambiar el valor del select, es decir, sin el evento onchange.

He provado a llamar en onload del body a la misma funcion que llamo en el onchange del select, pero no funciona.

Le he dado mil vueltas y buscado info en la web pero no doy con la tecla, espero que puedan ayudarme por que ando algo apurado.

Gracias de antemano por compartir conocomiento, un saludo.

ArturoGallegos · #2 (**permalink**) 01/06/2018, 19:45

1.- si conoces el valor de default de ese seleccion puedes hacer que se muestren los input correspondientes a ese valor sin tener que obtenerlo primero.

2.- si es el valor seleccionado previamente por el usuarrio en otra pagina o en otra sesion, puedes almacenar esa variable en una coockie y obtenerla al cargar.

Tambien esta el hecho de que sin ver tu codigo poco te podemos ayudar

olimpico10 · #3 (**permalink**) 02/06/2018, 12:33

Buenas tardes, gracias por tu respuesta ArturoGallegos.

El caso en el que nos movemos es el 2, de hecho el valor que viene selccionado al cargar la página ya lo tengo almacenado en una variable.

Mi función javascript es la siguiente:

function mostrarComentarios(id){
var select = document.getElementById("origen"+id);
var origen = select.options[select.selectedIndex].text;
var div = document.getElementById('comentarioorigen'+id);

if(origen=='Otro' || origen=='Otras'){
div.style.display = '';
}else{
div.style.display='none';
}
}

En la variable select guardo el select del que depende si se muestra o no el otro, llamado comentarioorigen+id

Esta función sirve perfectamente cuando la llamo desde el elemento onchange del select, pero no puedo hacerla funcionar en el evento onload.

Mi idea sería en el onload hacer ejecutarse esta función varias veces una vez por cada select distinto con su id. Pero

ArturoGallegos · #4 (**permalink**) 02/06/2018, 14:35

eso jamas te va a funcionar.,
1.- la variable select es parte de una función y no una variable global, aunque recargaras el contenido SIN recargar la pagina, no puedes accesar a ella desde otro punto.

2.- javascript trabaja solo de manera local y unicamente se almacena por sesión, es decir al recargar la pagina ya sea que cambies a otra o recargues la pagina (F5) todos los datos almacenados en una variable javascript se elimina/pierde.

Dicho eso, te recomiendo crear una cookie con lenguaje del lado de servidor, por ejemplo con PHP
http://php.net/manual/es/function.setcookie.php

de esa forma cuando recargues o llegues al nuevo destino puedes consulta esa cookie

olimpico10 · #5 (**permalink**) 03/06/2018, 13:24

Buenas tardes,

no estoy seguro de entenderte. Es cierto que esa variable es local, de la función, pero en el momento que la llamo en el onload con <body onload="mostrarComentarios(1)" la variable se crea en el entorno de la función. Esa variable lo único que almacena es el select que lllamado origen1 (o el número que le pase al llamar la función).

Por otro lado no necesito la cookie ya que utilizo Struts 2 y el valor seleccionado ya me llega en una variable.

Un saludo.

ArturoGallegos · #6 (**permalink**) 03/06/2018, 20:11

Pues me temo que has de esperar a que venga alguien que conozca Struts 2, yo no lo conozco y no pretendo meterme a conocerlo por ahora.

De entrada yo sostengo lo que te dije, así como lo muestras no funcionara ya que al cambiar la pagina no se preserva el select.

Claro es mi humilde opinión sin conocer Struts quizás alguien que lo conozca me pueda contradecir... a esperar a alguien que te pueda apoyar.

olimpico10 · #7 (**permalink**) 04/06/2018, 06:51

Buenas ArturoGallegos, gracias por tu respuesta.

Creo que no me estoy explicando bien. Lo que quiero es hacer una llamada a una función en el momento de cargar la página y que dependiendo del elemento que esté seleccionado en un select se muestren, o no, otras partes de la web.

El elemento seleccionado ya viene definido antes de cargar la página y eso es algo de lo que se encarga la lógica del programa, de modo que se trata solamente de leer el valor selected de ese select con el DOM.

Ahora lo que no sé, es si por lo que sea el DOM no funciona así en el momento de cargar la página. Esa simple lectura del elemento en el DOM me funciona perfecto cuando la llamo desde el evento onchange del select, pero no me funciona al momento de llamarla desde el evento onload, es decir al cargar la página.

Entonces, mi pregunta es, como puedo durante el evento onload, acceder al elemento selected de un select y compararlo con algo, por ejemplo select=="otros".

Espero haberme explicado ahora mejor, saludos.

olimpico10 · #8 (**permalink**) 05/06/2018, 15:05

Muy buenas,

ya está solucionado, solo se trataba de llamarla con window.onload en lugar de con la propiedad onload del body y (muy importante) hacer la llamada al script por debajo de la definición del select en el html. En mi caso simplemente haciendola al final del código.

Gracias por vuestra ayuda, espero que pueda resultarle util a alguien este hilo.

Un saludo.