PDA

View Full Version : [CSS] visibilità form

TorpedoBlu
20-03-2008, 10:13
ciao ragazzi, ho una form dove l'utente seleziona i dati di un bonifico, di default deve essere italiano con i dati con la nomenclatura italiana (cab abi ecc..) mentre se nella bombo seleziona un'altro paese deve cambiare la form con una form internazionale (comune ai paesi stranieri)

come faccio? c'è modo di usare un div che cambia la sua visibilità (2 div che si scambiano)?

non so se sono stato chiaro
TorpedoBlu
20-03-2008, 11:37
ad esempio


<form>
<select >
<option>1</option>
<option>2</option>
</select>
<div id="id_livello1">ciao1</div>
<div id="id_livello2">ciao2</div>
</form>


la select mi deve rendere visibile un solo livello
stdecden
20-03-2008, 12:41
Certo, ma lo devi fare con javascript:

document.getElementById("id_livello1").style.visibility = "visible";
document.getElementById("id_livello2").style.visibility = "hidden";
TorpedoBlu
20-03-2008, 13:44
Certo, ma lo devi fare con javascript:

document.getElementById("id_livello1").style.visibility = "visible";
document.getElementById("id_livello2").style.visibility = "hidden";


e dove vanno messe queste istruzioni? nel tag select?
TorpedoBlu
20-03-2008, 14:07
<body>

<form name="ibanform" action="#" method="get">
<table align="center" id="cordBancarie" border="1" cellspacing="0">
<tr>
<td align="left" nowrap="nowrap">
ISO CODE <select name="isoCode" onchange='
document.getElementById("coordinateItaliane").style.visibility = "hidden";
document.getElementById("coordinateEstere").style.visibility = "visible";
'>
<option value="IT" selected="selected">Italia</option>
<option value="XX">Estero</option>
</select>
</td>
<td align="left" nowrap="nowrap">
<div id="coordinateItaliane">italia</div>
<div id="coordinateEstere" style="visibility: hidden;">estero</div>
</td>
</tr>
</table>
</form>
</body>



ma :

1) se torno su italia non rivisualizza come prima
2) i 2 div comunque occupano lo spazio anche quando non sono visibili...
TorpedoBlu
21-03-2008, 08:44
ok, al posto di "visible" uso "display"

ma come faccio a fare una funzione che "switchi" i due div?
vladix
21-03-2008, 09:05
<script>
function change(element){
var currentSelection = element.options[element.selectedIndex].value;
if(currentSelection == 'IT'){
document.getElementById("coordinateItaliane").style.display = "block";
document.getElementById("coordinateEstere").style.display = "none";
}else{
document.getElementById("coordinateItaliane").style.display = "none";
document.getElementById("coordinateEstere").style.display = "block";
}
}
</script>




<select name="isoCode" onchange='change(this)'>
<option value="IT" selected="selected">Italia</option>
<option value="XX">Estero</option>
</select>
TorpedoBlu
21-03-2008, 09:27
<script>
function change(element){
var currentSelection = element.options[element.selectedIndex].value;
if(currentSelection == 'IT'){
document.getElementById("coordinateItaliane").style.display = "block";
document.getElementById("coordinateEstere").style.display = "none";
}else{
document.getElementById("coordinateItaliane").style.display = "none";
document.getElementById("coordinateEstere").style.display = "block";
}
}
</script>




<select name="isoCode" onchange='change(this)'>
<option value="IT" selected="selected">Italia</option>
<option value="XX">Estero</option>
</select>



ok grande, ci stavo arrivando :D