visualizzazione livelli

**claudia_c82** · 29-05-2008, 19:15

Salve a tutti,

premetto che di JS non ne so praticamente niente...
gli script li prendo in giro per il web...
allora... ho un form dove con un campo select mi si dovrebbero mostrare/nascondere altri livelli..
ho questo codice (che al di fuori dei form funzionano perfettamente)

codice:

<script type="text/javascript">

function showCosto() { 
document.getElementById("costo1").style.visibility= "visible"; 
} 
function hideCosto() { 
document.getElementById("costo1").style.visibility= "hidden"; 
} 

function showPrezzo() { 
document.getElementById("prezzo1").style.visibility= "visible"; 
} 
function hidePrezzo() { 
document.getElementById("prezzo1").style.visibility= "hidden"; 
}
</script>

i div richiamati sono nascosti tramite i CSS

richiamo le funzioni così:

codice:

<select name="resaImpianto" class="select" id="resaImpianto">
            <option value="" selected="selected" onclick="hidePrezzo(); hideCosto()">selezionare</option>
            <option value="risparmio in bolletta" onclick="showCosto(); hidePrezzo()">risparmio in bolletta</option>
            <option value="vendita energia prodotta" onclick="showPrezzo(); hideCosto()">vendita energia prodotta</option>
                    </select>

ho provato a sostituire "onclick" con "onchange" ma niente..

ah... cosa fondamentale:
su Firefox funziona alla grande...
il problema è su explorer... ovviamente

**cavicchiandrea** · 29-05-2008, 21:17

Credo che ie non supporti gli eventi nelle options, fai cosi:

codice:

<select name="resaImpianto" class="select" id="resaImpianto" onchange="if(this.selectedIndex!=0){showCosto(); hidePrezzo()}else{hidePrezzo(); hideCosto()}>
<option value="" selected="selected" >selezionare</option>
            <option value="risparmio in bolletta" >risparmio in bolletta</option>
            <option value="vendita energia prodotta" >vendita energia prodotta</option>
                    </select>

**claudia_c82** · 30-05-2008, 15:30

ciao, intanto grazie per la risposta...

il codice funziona, però io ho 3 opzioni:

showCosto(); hidePrezzo()
showPrezzo(); hideCosto()
hidePrezzo(); hideCosto()

Ho provato a modificare il tuo codice con un altro if... ma fa molta confusione

**claudia_c82** · 30-05-2008, 18:37

ciao, per necessità ho risolto così

codice:

<select name="resaImpianto" class="select" id="resaImpianto" onchange="if(this.selectedIndex!=1){showCosto(); hidePrezzo()}else{showPrezzo(); hideCosto()}">
            <option value="risparmio in bolletta" selected="selected" >risparmio in bolletta</option>
            <option value="vendita energia prodotta" >vendita energia prodotta</option>
                    </select>

però mi piacerebbe sapere se c'è un modo per partire da "seleziona" e avere 2 possibilità di scelta...

Cmq... grazie 1000 per la dritta

**cavicchiandrea** · 30-05-2008, 22:07

Adatta questo alle tue esigenze

codice:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Documento senza titolo</title>
<script type="text/javascript">
function Mostra(option){
if (option.options[option.selectedIndex].value == 1){noattivo = "hidden"; attivo = "visible";
document.getElementById('costo1').style.visibility=attivo;
document.getElementById('prezzo1').style.visibility=noattivo;}
else if (option.options[option.selectedIndex].value == 2){noattivo = "hidden"; attivo = "visible";
document.getElementById('costo1').style.visibility=noattivo;
document.getElementById('prezzo1').style.visibility=attivo;}
else{ 
document.getElementById('costo1').style.visibility="hidden";
document.getElementById('prezzo1').style.visibility="hidden";
}}
</script>
<style type="text/css">
div#prezzo1{visibility:hidden}
div#costo1{visibility:hidden}
</style>
</head>

<body>
<select name="resaImpianto" class="select" id="resaImpianto" onchange="Mostra(this)">
<option value="0" selected="selected">selezionare</option>
<option value="1">risparmio in bolletta</option>
<option value="2">vendita energia prodotta</option>
</select>
<div id="costo1">Inserire qui il contenuto per  id "costo1"</div>
<div id="prezzo1">Inserire qui il contenuto per  id "prezzo1"</div>
</body>
</html>

**claudia_c82** · 02-06-2008, 14:21

grazie davvero...
purtroppo (anzi per fortuna) adesso sono in ferie...
appena torno in ufficio lo testerò subito...

ciao e grazie ancora

Discussione: visualizzazione livelli

Strumenti discussione

Ricerca discussione

Visualizza

visualizzazione livelli

Permessi di invio