select dipendente da un'altra select

**scrittore80** · 01-03-2009, 12:50

Buongiorno ragazzi,

Obiettivo
Avere 2 combo box, uno dove sono elencate le regioni, l'altra le province. Nell'esempio che porto sotto ho messo solo Piemonte (con 3 province), Liguria (con 2) e Val d'Aosta (con 1).
Quando nella prima combo seleziono una regione, nell'altra devono comparire le relative province (e solo quelle

)

Problema
Se scelgo prima una regione con poche province e poi una con tante province funziona tutto (ad esempio seleziono prima Liguria, poi Piemonte), però se passo da una con poche province ad una con tante, ecco che le province che la vecchia regione aveva in più rimangono scritte.
Provate con questo codice a scegliere prima Piemonte, poi Valle d'Aosta....

Codice PHP:


<HTML>

<HEAD>

 <script type="text/javascript">

 

 function dennis(selezionata){

      //un array per ogni regione

    ar_pie=new Array();

    ar_val=new Array();

    ar_lig=new Array();

    //rimepio gli array con le province

    ar_pie[0]=new Option('Torino','Torino');

    ar_pie[1]=new Option('Asti','Asti');

    ar_pie[2]=new Option('Alessandria','Alessandria');



    ar_val[0]=new Option('Aosta','Aosta');    



    ar_lig[0]=new Option('Genova','Genova');

    ar_lig[1]=new Option('La Spezia','La Spezia');

    

    //a seconda della voce selezionata nella prima combo, scelgo a quele array assegnare la combo delle province

    if(selezionata=="Piemonte")

        array_rif=ar_pie;

    if(selezionata=="Valle d'Aosta")

        array_rif=ar_val;

    if(selezionata=="Liguria")

        array_rif=ar_lig;

    

        /*FORSE QUI DEVO ASSEGNARE UN NUOVO ARRAY A

         document.form1.province?*/





    //inizializzo la combo delle province in modo opportuno

    for(i=0;i<array_rif.length;i++)

        document.form1.province.options[i]=array_rif[i];

}

</script>

</HEAD>

<BODY>



<form name="form1">

<select name="regioni" onChange="dennis(this[selectedIndex].value)">

    <option value="Regione">Regione</option>

    <option value="Piemonte">Piemonte</option>

    <option value="Valle d'Aosta">Valle d'Aosta</option>

    <option value="Liguria">Liguria</option>

</select>

    

<select name="province">

<option>Provincia</option>

</select>               





</BODY>

</HTML>

Nel codice ho messo come commento una possibile soluzione, grazie per i vostri suggerimenti

**scrittore80** · 01-03-2009, 18:17

Non so... una soluzione fattibile potrebbe essere di farmi passare dalla form il numero di opzioni della combo e poi eventualmente eliminare quelle in eccesso....

Avete suggerimenti su come realizzarlo? Grazie

**scrittore80** · 03-03-2009, 11:49

Ho trovato la soluzione, spero che a qualcuno un giorno possa servire

Codice PHP:


<HTML>

<HEAD>

 <script type="text/javascript">

 

 function dennis(selezionata){

      //ricavo l'oggetto che contiene l'elenco delle province

    option=document.getElementById("province")

      //il numero di opzioni precedenti

      var dim_prec=option.length      

    

    //un array per ogni regione

    ar_pie=new Array();

    ar_val=new Array();

    ar_lig=new Array();

    //rimepio gli array con le province

    ar_pie[0]=new Option('Torino','Torino');

    ar_pie[1]=new Option('Asti','Asti');

    ar_pie[2]=new Option('Alessandria','Alessandria');



    ar_val[0]=new Option('Aosta','Aosta');    



    ar_lig[0]=new Option('Genova','Genova');

    ar_lig[1]=new Option('La Spezia','La Spezia');

    

    //a seconda della voce selezionata nella prima combo, scelgo a quele array assegnare la combo delle province

    if(selezionata=="Piemonte")

        array_rif=ar_pie;

    if(selezionata=="Valle d'Aosta")

        array_rif=ar_val;

    if(selezionata=="Liguria")

        array_rif=ar_lig;    

    

    

    //inizializzo la combo delle province in modo opportuno

    for(i=0;i<array_rif.length;i++)

        document.form1.province.options[i]=array_rif[i];

    

    //dimensione attuale del numero di opzione

    dim_att=array_rif.length

    

    //rimuovo le opzioni in eccesso

      if(dim_att<dim_prec)

      {    

           for(var i=dim_att;i<dim_prec;i++)

           {    

            option.remove(option.length-1)

        }        

    }

}

</script>

</HEAD>

<BODY>



<form name="form1">

<select name="regioni" onChange="dennis(this[selectedIndex].value)">

    <option value="Regione">Regione</option>

    <option value="Piemonte">Piemonte</option>

    <option value="Valle d'Aosta">Valle d'Aosta</option>

    <option value="Liguria">Liguria</option>

</select>

    

<select id="province">

<option>Provincia</option>

</select>               





</BODY>

</HTML>

Discussione: select dipendente da un'altra select

Strumenti discussione

Ricerca discussione

Visualizza

select dipendente da un'altra select

Permessi di invio