Newsgroup: it.comp.lang.javascript
Titolo: Select collegate

Saluti alla Mailing List,
qualcuno sa come si possa fare uno script per collegare due select,
cioč che mi permetta di settare le opzioni di una select in base al
valore selezionato dall'altra. Ad esempio se le due select fossero
regioni e provincia, selezionando una regione la seconda select mi
presenterebbe tutte le provincie di quella regione. 
Grazie a tutti,
ciao
Daniele

 ha scritto nel messaggio
news:3a17a7d6...@news.nettuno.it...

Solo IE5+  NN6.........basta aggiungere gli array.....
<html>
<head>
<title>test</title>
<script language="javascript">
//--and...@atipower.it--
//--
http://www.jsdir.com--
//-------------------------
function crea(zz){
lprov= new Array();
lprov[0]="sondrio";
lprov[1]="milano";
aa=lprov.length;
eprov=new Array();
eprov[0]="Rimini"
eprov[1]="Parma"
bb=eprov.length;
prov=new Array();
prov[0]=lprov;
prov[1]=eprov;
cc=prov.length
quante=new Array();
quante[0]=aa;
quante[1]=bb;
hh=prov[zz]
pp=quante[zz]
if(document.getElementById){
if(document.getElementsByName('nuovo').length==0){
var newElem =document.createElement("select");
newElem.id="nuovo";
document.body.childNodes[0].appendChild(newElem)
for(i=0; i<pp; i++){
var newElem1= document.createElement("option");
newElem1.setAttribute('value',i);
var newText1 = document.createTextNode(hh[i]);
newElem1.appendChild(newText1) ;
document.body.childNodes[0].childNodes[1].appendChild(newElem1)
}
}
else if(document.getElementsByName('nuovo').length==1){
if(zz !=""){
document.getElementById('nuovo').style.display=""
for(i=0; i<pp; i++){
var newText2 = document.createTextNode(hh[i]);
document.getElementById('nuovo').childNodes[i].childNodes[0].nodeValue=hh[i]
;
}
}
else{
document.getElementById('nuovo').style.display="none"
}
}
}
}
</script>
</head>
<body>
<form method="POST" >
  <p><select size="1" name="D1"
onChange="crea(this.options[this.selectedIndex].value)">
    <option selected value="">SCEGLI REGIONE</option>
    <option value="0">Lombardia</option>
    <option value="1">Emilia</option>
  </select></p>
</form>
</body>
</html>
andreotta fabiano
WebMŞster ATI POWER s.n.c.
andr...@atipower.it
http://www.atipower.it
http://www.aticommerce.com
http://www.afdsoftware.freeweb.org
http://www.jsdir.com
http://www.javascript.3000.it

Nel codice con cui hai risposto [Fabiano ...] al post noto l'impiego di 
getElementByID();
document.createElement("stringa");
document.body.childNodes[0].appendChild(newElem);
ed altro codice che palesemente tiene conto del nuovo DOM.
Documentazione in tal senso è reperibile in 
www.w3c.org
, ma non è di
semplicissima lettura.
Si può scaricare un bel pdf [cosa che ho fatto ...], ma, ai miei occhi
di appassionato, ma non professionista, suona un po' ... gaelico !!!
Puoi segnalarmi [se ci sono] altre fonti un po' più orientate al
tutorial?
Ho già rivoltato da capo a piedi jsdir 8) ma non ho trovato nulla.
Ciao, Daniele

 wrote in message
3A199139...@iol.it...

Adesso lo trovi....
Appena pubblicato...da Riccardo il tutorial che ho finito oggi di
preparare.......
I metodi e le proprietà che ho provato e che sono nel tutorial funzionano
con IE5 e NN6.......
Ciao!
andreotta fabiano
WebMªster ATI POWER s.n.c.


 Ho già rivoltato da capo a piedi jsdir 8) ma non ho trovato nulla.
Ah sei stato tu che ci hai rivoltati.... ecco da dove viene lo spiffero... :)
Scrivi alle 21:01?
Provaci ora (mentre ti scrivo off-line sono le 23:20) :-)))
-- 
Ciao, Riccardo
------------------------------------------------------------------------
WebMaster: ----> 
http://www.jsdir.com
 <---- (aka 
http://www.jspoint.it
)
------------------------------------------------------------------------
               Nessun traguardo è abbastanza lontano.
------------------------------------------------------------------------

grande !!!
Ho appena finito un lavoro [sono le 06.25 ed il modem fuma ancora per
l'upload  a dir poco ... corposo ...] e sto crollando verso il letto, ma
aver preso coscienza dell'esistenza dei tutorial mi fa un gran piacere!
Dormirň meglio 8)
Appena ristabilito, li leggo.
Grazie ancora e ciao!
Daniele

 Daniele
C'è una piccola correzione che abbiamo fatto (dopo la segnalazione di
p.carena) nel tutorial e che Riccardo inserirà al più presto........che cmq
è questa....
Per IE è tutto valido cos'ì com'è......però per mantenere piena
compatibilità con NN6 (vedi thread innerHTML) è consigliato invece di
scendere la gerarchia per identificare un nodo , assegnargli un ID e
richiamarlo con il vecchio metodo...document.getElementById(ID)
Il resto funziona correttamente , sia creazione di nodi che modifica e
rimozione.....
Quindi modificherò anche lo script sopra postato perchè riscontra un
problema con NN6 nel riconoscimento di un nodo..


Ripubblico lo script riveduto e corretto e funzionante in IE5+ e NN6
<html>
<head>
<title>test</title>
<script language="javascript">
//--and...@atipower.it--
//--
http://www.jsdir.com--
//-------------------------
function crea(zz){
lprov= new Array();
lprov[0]="SCEGLI";
lprov[1]="sondrio";
lprov[2]="milano";
aa=lprov.length;
eprov=new Array();
eprov[0]="SCEGLI";
eprov[1]="Rimini"
eprov[2]="Parma"
bb=eprov.length;
prov=new Array();
prov[0]=lprov;
prov[1]=eprov;
cc=prov.length
quante=new Array();
quante[0]=aa;
quante[1]=bb;
hh=prov[zz]
pp=quante[zz]
if(document.getElementById){
if(!document.getElementById('nuovo')){
var newElem =document.createElement("select");
newElem.id="nuovo";
document.getElementById('form').appendChild(newElem)
for(i=0; i<pp; i++){
var newElem1= document.createElement("option");
newElem1.setAttribute('value',i);
var newText1 = document.createTextNode(hh[i]);
newElem1.appendChild(newText1) ;
document.getElementById('nuovo').appendChild(newElem1)
}
}
else {
if(zz !=""){
document.getElementById('nuovo').style.display=""
for(i=0; i<pp; i++){
var newText2 = document.createTextNode(hh[i]);
document.getElementById('nuovo').childNodes[i].childNodes[0].nodeValue=hh[i]
;
}
}
else{
document.getElementById('nuovo').style.display="none"
}
}
}
}
</script>
</head>
<body>
<form method="POST" id="form">
  <p><select size="1" name="D1"
onChange="crea(this.options[this.selectedIndex].value)">
    <option selected value="">SCEGLI REGIONE</option>
    <option value="0">Lombardia</option>
    <option value="1">Emilia</option>
  </select></p>
</form>
</body>
</html>
andreotta fabiano


Grazie!!
Purtroppo devo farlo funzionare con IE 4+ e NN4+. Pensavo di usare una
soluzione come quella usata nel form di iscrizione a Clubnet della Tin, cioč
un a finestra di pop up contenente la seconda select. Sai come č possibile
realizzarla, cioč come fa la finestra pop up a passare il parametro alla
prima?
Spero di essermi spiegato.
Ciao
Daniele


Certo...questo per me è stato più che altro uno spunto per verificare le
proprietà e i metodi del DOM......cmq
su 
http://www.jsdir.com
 c'è il tutorial sul passaggio dati tra finestre e
quello nuovo di Riccardo su window.open
Se non riesci ..se ho tempo ci guardo.......
