Popolare select dinamiche con AJAX

[Cheope]

Sto facendo i primi esperimenti con Ajax e per iniziare ho guardato uno script trovato su W3Schools: http://www.w3schools.com/ajax/ajax_source.asp
Ho pensato che per iniziare potrei rifare un sistema di select dinamiche che prima gestivo tramite array ecc...
Il funzionamento è il solito: ho due select, un con province e l'altra con comuni.
Quando clicco su una provincia nella prima select, la seconda deve visualizzare solo i comuni appartenenti alla provincia scelta.
I dati vengono presi da una pagina php che seleziona sul db tutti i comuni appartenenti alla provincia passata in GET nella richiesta dell'oggetto XMLHttpRequest
e scrive direttamente in output con echo una stringona html del tipo <option value="x">comune x</option><option value="y">comune y</option>.
Cercando sul forum, è lo stesso metodo di lavorare postato qui: http://http://forum.html.it/forum/sh...hreadid=965139 )
Fin qui tutto ok.

Il problema è quando inietto tramite innerHTML l'html risultante dalla pagina PHP nella seconda select.
In Firefox funziona tutto alla grande.
In IE invece la seconda select rimane vuota, senza dare nessun errore.

Ho provato ad aggiungere un alert in modo da visualizzare la stringa di risposta responseText e l'unica differenza è che in explorer viene troncata la prima option.
Ho provato a far scrivere alla pagina PHP cose diverse, mettendo la stringa dentro ad htmlspecialchars, htmlentities ecc... ma con scarso successo... (anche perchè poi in javascript devo decodificare...)
Ho provato a far scrivere solo le <option>Comune x</option> senza value e quindi senza virgolette...
Ho provato a scrivere le entità carattere &gt; ed &lt;....
Ho provato a cambiare il DOCTYPE...
Inutile dire che se scrivo il responseText con solo i nomi dei comuni dentro ad un div normalissimo, funziona anche in IE.
Il problema è che quel responseText contiene tags e probabilmente durante il passaggio vengono "tradotti"...
Forse dovrei passare uno stringone con dei delimitatori, fare lo split e ricostruirmi le option con Javascript, oppure dovrei usare DOM e aggiungere le option con appenChild e roba simile?

 <script type="text/javascript">

var xmlHttp

function popolaSelect(parametri){ 
	if (parametri.length > 0){ 
		var url="comuni.php?" + parametri
		xmlHttp=GetXmlHttpObject(stateChanged)
		xmlHttp.open('get', url , true)
		xmlHttp.send(null)
	} else { 
		document.getElementById("comune").innerHTML=""
	} 
} 

function stateChanged(){ 
	if (xmlHttp.readyState==4 || xmlHttp.readyState=="complete"){ 
		document.getElementById("comune").innerHTML=xmlHttp.responseText;
		alert(document.getElementById("comune").innerHTML) // debug
	} 
} 

function GetXmlHttpObject(handler){ 
	var objXmlHttp=null
	if (navigator.userAgent.indexOf("Opera")>=0){
		alert("This example doesn't work in Opera") 
		return 
	}
	if (navigator.userAgent.indexOf("MSIE")>=0){ 
		var strName="Msxml2.XMLHTTP"
		if (navigator.appVersion.indexOf("MSIE 5.5")>=0){
		strName="Microsoft.XMLHTTP"
		} 
		try	{ 
			objXmlHttp=new ActiveXObject(strName)
			objXmlHttp.onreadystatechange=handler 
			return objXmlHttp
		} 
		catch(e){ 
			alert("Error. Scripting for ActiveX might be disabled") 
			return 
		} 
	} 
	if (navigator.userAgent.indexOf("Mozilla")>=0){
		objXmlHttp=new XMLHttpRequest()
		objXmlHttp.onload=handler
		objXmlHttp.onerror=handler 
		return objXmlHttp
	}
} 

</script>

<form action="ricerca.php" method="get">

<label for="provincia" class="home">provincia:</label><select title="selezionare il provincia di appartenenza" name="provincia" id="provincia" onchange="javascript:popolaSelect('id_provincia='+this.value);">
<option value="">-----Tutte-----</option><?php
$province = new ConnessioneMySQL("SELECT * FROM province");
while ($province->fetchArray()) {
	echo "<option value=\"".$province->record["id"]."\">".$province->record["provincia"]."</option>";
}?></select>

<label for="comune" class="home">comune:</label><select title="selezionare il comune di appartenenza" name="comune" id="comune">
<option value="">-----Tutti-----</option><?php
$comuni = new ConnessioneMySQL("SELECT * FROM comuni");
while ($comuni->fetchArray()) {
	echo "<option value=\"".$comuni->record["id"]."\">".$comuni->record["comune"]."</option>";
}?></select>

</form>

[pietro09]

Io ho un esempio, regioni-provincie e va con IE e Firefox.

per PROVINCIE, utilizzo come segnaposto, un <div.
Quando seleziono una regione dalla prima lista, ajax mi restituisce la lista (select) delle provincie per la data regione, e la inserisco nel segnaposto con:

***
var t = this.request.responseText;
document.getElementById("div1").innerHTML = t;
***

non so se sia utile

[Cheope]

quindi dici che dovrei far uscire in output da PHP le option complete di select... :master:
Ora provo...
Thanx
Ps. Una curiosità: ma il plurale di provincia si scrive con la i? Mi sembra di no...

[Cheope]

EVVAI!!!
Grazzzzie pietro09!

Facendo scrivere a PHP l'intero <select> e sostituendolo per intero dentro a un div del form funge anche in IE!!!


Resta comunque strano...
Ma come diceva qualcuno: la teoria è quando tutto dovrebbe funzionare e invece non funziona, la pratica è quando tutto funziona e non si sa perchè....

[pietro09]

Non sapevo che con Firefox bastasse mettere solo le options

[Cheope]

Vuoi dire che in questo caso è FF lo "strano"?

[pietro09]

Originariamente inviato da Cheope
Vuoi dire che in questo caso è FF lo "strano"?

No per default sbaglia sempre IE

[Cheope]

[pietro09]

Hai ragione , il plurare di provincia è province

Però potevi tenertelo per te, adesso mi vergogno troppo

Viva Dante e l'Italiano

[Cheope]

Nessuno è perfetto...
Ciao e grazie ancora!