radio button per mostrare o nascondere campi

**meganoide** · 09-04-2006, 16:42

con questo script,al click su un radio viene mostrato il relativo campo di testo:

codice:

<html>
<head>
<title></title>
<script language="Javascript">
function showDiv(id) { 
    document.getElementById(autEmail).autEmail.style.visibility = 'hidden'; 
    document.getElementById(autSito).autSito.style.visibility = 'hidden'; 
    document.getElementById(autEmail).autEmail.value = ''; 
    document.getElementById(autSito).autSito.value = ''; 
    document.getElementById(id).style.visibility = 'visible'; 
    document.all[id].focus(); 
}
</script>
</head>
<body>

<form action="" name="form" method="post">
uno <input type="radio" value="autEmail" name="opzioniAutore" onClick="showDiv('autEmail');"><input type="text" style="visibility:hidden" id="autEmail" size="15" name="autEmail"">
due <input type="radio" value="autSito" name="opzioniAutore" onclick="showDiv('autSito');"><input type="text" style="visibility:hidden" id="autSito" size="25" name="autSito"">
tre <input type="radio" value="autTesto" name="opzioniAutore">

</form>
</body>
</html>

però funziona solo con

codice:

document.all

(che non è standard) al posto di

codice:

document.getElementById

come si può modificarlo?

**var** · 09-04-2006, 16:47

codice:

document.getElementById(id).focus();

ti consiglio comunque di non usare id come nome del parametro che passi alla funzione (id e' un termine riservato in JavaScript).

ciao

**meganoide** · 09-04-2006, 17:06

dà sempre errore e non mostra/nasconde nulla:

Avviso: Elemento referenziato per ID/NAME a livello globale. Si dovrebbe invece utilizzare il document.getElementById(), standard W3C.
Riga: 6

Errore: document.getElementById(autEmail) has no properties
Riga: 6

**cavicchiandrea** · 09-04-2006, 23:10

Cosi funziona:

codice:

<html>
<head>
<title></title>
<script language="Javascript">
function showDiv(radioselect) { 
    document.getElementById("autEmail").style.visibility = 'hidden'; 
    document.getElementById("autSito").style.visibility = 'hidden'; 
    document.getElementById("autEmail").value = ''; 
    document.getElementById("autSito").value = ''; 
    document.getElementById(radioselect).style.visibility = 'visible'; 
    document.getElementById(radioselect).focus(); 
}
</script>
</head>
<body>

<form action="" name="form" method="post">
uno <input type="radio" value="autEmail" name="opzioniAutore" onClick="showDiv('autEmail');"><input type="text" style="visibility:hidden" id="autEmail" size="15" name="autEmail"">
due <input type="radio" value="autSito" name="opzioniAutore" onclick="showDiv('autSito');"><input type="text" style="visibility:hidden" id="autSito" size="25" name="autSito"">
tre <input type="radio" value="autTesto" name="opzioniAutore">

</form>
</body>
</html>

**meganoide** · 10-04-2006, 10:51

ma c'è un problema: se voglio che un radio button nasconda, al click, i campi di testo degli altri Radio? ora, cliccando sul terzo radio, il campo di testo di uno dei primi 2 radio resta visibile...

**cavicchiandrea** · 10-04-2006, 15:00

Originariamente inviato da meganoide
ma c'è un problema: se voglio che un radio button nasconda, al click, i campi di testo degli altri Radio? ora, cliccando sul terzo radio, il campo di testo di uno dei primi 2 radio resta visibile...

Dalle prove fatte con FF IE a me questo non accade, se seleziona radio 1 visualizzo autEmail se seleziono radio 2 visualizzo autSito e scampare autEmail ecc..
Se persiste l'errore non è collegato a questa funzione.

codice:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title></title>
<script language="Javascript">
function showDiv(radioselect) {
    document.getElementById("autTesto").style.visibility = 'hidden'; 
    document.getElementById("autTesto").style.visibility = 'hidden'; 
    document.getElementById("autEmail").style.visibility = 'hidden'; 
    document.getElementById("autSito").style.visibility = 'hidden'; 
    document.getElementById("autEmail").value = ''; 
    document.getElementById("autSito").value = ''; 
    document.getElementById(radioselect).style.visibility = 'visible'; 
    document.getElementById(radioselect).focus(); 
}
</script>
</head>
<body>

<form action="" name="form" method="post">
uno <input type="radio" value="autEmail" name="opzioniAutore" onClick="showDiv('autEmail');"><input type="text" style="visibility:hidden" id="autEmail" size="15" name="autEmail"">
due <input type="radio" value="autSito" name="opzioniAutore" onclick="showDiv('autSito');"><input type="text" style="visibility:hidden" id="autSito" size="25" name="autSito"">
tre <input type="radio" value="autTesto" name="opzioniAutore" onclick="showDiv('autTesto');">
<input type="text" style="visibility:hidden" id="autTesto" size="25" name="autTesto"">
</form>
</body>
</html>

**meganoide** · 10-04-2006, 15:46

ora sembra funzionare correttamente.
Ho notato che se metto il value ai campi di testo <input type.... value="qualcosa"> al click sul radio compaiono bianchi, senza il value.

Eppure è scritto di default.

**CDNE** · 22-05-2006, 18:35

Ciao a me funziona tutto correttamente solo che...

ho la necessità di inserire più di un <input type etc....ect....>

per ogni selezione Radio.....

Discussione: radio button per mostrare o nascondere campi

Strumenti discussione

Ricerca discussione

Visualizza

radio button per mostrare o nascondere campi

Permessi di invio