problema con select dinamiche e javascript

  • Creatore Discussione Creatore Discussione HyperX
  • Data di inizio Data di inizio

HyperX

Nuovo Utente
28 Ago 2015
2
0
0
salve a tutti, ho un problema con due select dinamiche, spero di spiegarvi bene

le due select prendono i valori del contenuto da un file xml
la prima mette una categoria, a seconda della categoria scelta, la seconda select dovrebbe cambiare il suo contenuto
esempio - nella prima select se seleziono veicoli nella seconda dovrebbero comparire terrestri e volanti
però quando cambio la prima select, il contenuto della seconda rimane invariato, e devo ricaricare la pagina per farlo apparire, credo che il problema sia nell' onchange, ma non ne sono molto sicuro
qualcuno sa come risolvere ? grazie in anticipo

HTML:
<select id="selectCategoria" onchange='crea_gruppo(document.getElementById("selectCategoria").options[document.getElementById("selectCategoria").selectedIndex].value);'>
			<option selected="selected" value="null">Seleziona tipo di ricerca</option>
			<option value="Personaggio">Personaggi</option>
			<option value="Arma">Armi</option>
			<option value="Veicolo">Veicoli</option>
			</select>
		    <select id="selectGruppo">
		    <option selected="selected" value="">-seleziona-</option>
		    </select>

Javascript ( ho inserito solo le parti che reputavo necessarie)

Codice:
	/*metodo con cui creo la prima select "categoria"*/
	this.creaSelectCategoria =
      function () {
         var categorie = {};
         for (var i = 0; i<this.lista.length; i++) {
            categorie[this.lista[i].categoria] = true;
         }
         var s = "";
		 s+='<option value="null" >Seleziona una Categoria </option>';
         for (var i in categorie) {
            s += '<option value="' + categorie[i] + '">' + categorie[i]  + '</option>';
         }
		 return s;
      }  
		/*metodo con cui creo la seconda select "gruppo"*/
	 this.creaSelectGruppo =
      function () {
         var c= document.getElementById("selectCategoria").value;
         var gruppi = {};
         for (var i = 0; i<this.lista.length; i++) {
            if(this.lista[i].categoria==c){
				gruppi[this.lista[i].gruppo] = this.lista[i].gruppo;
			}
         }
         var s = "";
		 s+='<option value="null" >Seleziona un gruppo</option>';
         for (var i in gruppi) {
            s += '<option value="' + gruppi[i] + '">' + gruppi[i] + '</option>';
         }
	
         return s;
		 
      }




function inizializza(){
var nodo = caricaXML("elenco.xml");
	contenitore.inizializza(nodo);
	
	var nodoSelectCategoria = document.getElementById("selectCategoria");
	nodoSelectCategoria.onchange= contenitore.creaSelectCategoria();	
	var nodoSelectGruppo = document.getElementById("selectGruppo");
	nodoSelectGruppo.innerHTML = contenitore.creaSelectGruppo();
	
	
	var c1 = document.getElementById("cerca1");
	var c2 = document.getElementById("cerca2");
	
	c1.onclick = cercaNome;
	c2.onclick = cercaGruppo;
	
	
}


function crea_gruppo(categoria) {
         var gruppi = {};
         for (var i = 0; i < lista.length; i++) {
			if(lista[i].categoria==categoria)
			{
				gruppi[lista[i].gruppo] = true;
			}
         }
         var s = '<option value="null"  >Seleziona gruppo</option>';
         for (var i in gruppi) {
            
			s += '<option value="' + i + '">' + i + '</option>';
         }
		
         document.getElementById("selectGruppo").innerHTML= s;
      
}
 

Discussioni simili