far apparire campi diversi a seconda di una scelta

[disaster.net]

Ciao...

credo che abbiate già trattato l'argomento ma non sono stato capace di trovarlo...

prendo ad esempio il sito www.subitoit

vorrei fare in modo che a seconda del valore selezionato su un campo <selct>

appaiano o meno determinate altre voci di campi imput

esempio
<select>
option 1 - casa
option 2 - Macchina
option 3 - Lavoro
</select>

se scelgo per esempio 1- casa
voglio che appaiano anche (e senza refrashare la pagina) i campi
- indirzzo, cap città,

se scelgo l'opzione 2 - macchina
- targa, anno immatricolazione, alimentazione (altro select)


questo è solo un esempio, ma credo che possiate aver capito.

Mi aiutate ?

grassie
Flavio

[lucavizzi]

crea i campi per ciascuna option e racchiudi ogni gruppo di campi in un div con id univoco uguale al valore della option.
Tutti i div con tutti i campi devono avere inizialmente uno style="display:none;"

Poi usando l'evento "onchange" mostri solo i campi associati alla singola option:

function show(id){
    
    //prima di mostrare il nuovo nascondo tutti i vecchi, usando il div "Box"
    var arr_divs=document.getElementById('Box').getElementsByTagName('div');
    for(var i=0; i<arr_divs.length; i++){
        arr_divs[i].style.display="none";
    }

    //quindi mostro i campi associati all'option
    document.getElementById(id).style.display="block";

}

<select onchange="show(this.value)">
    <option value="Casa">Casa</option>
    <option value="Macchina">Macchina</option>
    ecc.
</select>

<div id="Box">
    <div id="Casa" style="display:none">
        <input name="Indirizzo" />
        <input name="CAP" />
        ecc.
    </div>

    <div id="Macchina" style="display:none">
        <input name="Targa" />
        <input name="Alimantazione" />
        ecc.
    </div>
</div>

[disaster.net]

PERFETTO
GRAZIE !!!