- Home
- Categorie
- Coding e Sistemistica
- Javascript & Framework
- select dinamiche, errore assurdo, non compare la terza select
-
select dinamiche, errore assurdo, non compare la terza select
Ciao ragazzi,
ho provato a creare tre select dinamiche, la prima che dipende dalla seconda e la seconda della terza, con php e js.
Le prime due funzionano tranquillamente, selezione una provicia e mi torna tutti i comuni presenti. Adesso vorrei ampliarla a tre select, faccio tutto indenticamente però neanche mi visualizza la terza select, come mai?
Vi posto il codice:index.php
[PHP]
<?php
mysql_connect("localhost","root","") or die (mysql_error());
mysql_select_db("trinacria") or die (mysql_error());
?><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Popolare select dinamiche con AHAH</title><script type="text/javascript">
function createRequestObj(){ // creo un'istanza XMLHttpRequest
var re;
var browser=navigator.appName;
if (browser=="Microsoft Internet Explorer"){ // sniff browser
re=new ActiveXObject("Microsoft.XMLHTTP");
} else re=new XMLHttpRequest();
return re;
}var http=createRequestObj();
function popolaElemento(idElDaPopolare, paginaFonteDati, metodo, parametri){ // faccio una richiesta
// alert(parametri); // debug
var url=paginaFonteDati+"?" + parametri
http.open(metodo, url , true)
document.getElementById(idElDaPopolare).innerHTML="<select><option value="0">caricamento in corso...</option></select>";
http.onreadystatechange=function(){
if (http.readyState==4 || http.readyState=="complete"){
if (http.status == 200){
document.getElementById(idElDaPopolare).innerHTML=http.responseText;
} else {
document.getElementById(idElDaPopolare).innerHTML="<select><option>ERRORE "+http.status+"</option></select>";
}
}
}
http.send(null);
}function popolaElemento2(idElDaPopolare, paginaFonteDati, metodo, parametri){ // faccio una richiesta
// alert(parametri); // debug
var url=paginaFonteDati+"?" + parametri
http.open(metodo, url , true)
document.getElementById(idElDaPopolare).innerHTML="<select><option value="0">caricamento in corso...</option></select>";
http.onreadystatechange=function(){
if (http.readyState==4 || http.readyState=="complete"){
if (http.status == 200){
document.getElementById(idElDaPopolare).innerHTML=http.responseText;
} else {
document.getElementById(idElDaPopolare).innerHTML="<select><option>ERRORE "+http.status+"</option></select>";
}
}
}
http.send(null);
}
</script>
</head>
<body>
<h1>Esempio</h1><form action="pagina.php" method="get">
<!-- PROVINCIA -->
<label for="provincia" class="home">Provincia:</label>
<select title="selezionare la provincia di appartenenza" name="provincia" id="provincia" onChange="javascript:popolaElemento('selectComune', 'popola.php', 'get', 'id_prov='+this.value);">
<option value="">-----Tutte-----</option>
<?php
$strProvince=mysql_query("SELECT * FROM provincia");
// scrivo la select per intero
while ($result=mysql_fetch_array($strProvince)){ ?>
<option value="<?php echo $result[0] ?>"><?php echo $result[1] ?></option>
<?php } ?>
</select>
<!-- COMUNE --><BR>
<label for="comune" class="home">Comune:</label>
<span id="selectComune">
<select title="selezionare il comune di appartenenza" name="comune" id="comune" onChange="javascript:popolaElemento2('selectFrazione', 'popolafraz.php', 'get', 'id_comune='+this.value);">
<option value="">-----Tutte-----</option>
<?php
$strComuni="SELECT * FROM comuni";
$risultati2=mysql_query($strComuni, $connessione) OR DIE ("Impossibile eseguire la query");
while ($rs=mysql_fetch_array($risultati2)){ ?>
<option value="<?php echo $rs[0] ?>"><?php echo $rs[1] ?></option>
<?php } ?>
</select>
</span>
<!-- FRAZIONE --><BR>
<label for="frazione" class="home">Frazione:</label>
<span id="selectFrazione">
<select title="selezionare la Frazione di appartenenza" name="Frazione" id="Frazione">
<option value="">-----Tutti-----</option>
<?php
$strComuni="SELECT * FROM frazione";
$risultati2=mysql_query($strComuni, $connessione) OR DIE ("Impossibile eseguire la query");
while ($rs=mysql_fetch_array($risultati2)){ ?>
<option value="<?php echo $rs[0] ?>"><?php echo $rs[1] ?></option>
<?php } ?>
</select>
</span><?PHP $chiudi=mysql_close($connessione); ?>
</form>
</body>
</html>
[/PHP]popola.php
[PHP]
if (isset($_GET["id_prov"])){$strSQL="SELECT * FROM comune"; if (is_numeric($_GET["id_prov"]) AND $_GET["id_prov"]>0) $strSQL.=" WHERE id_prov=".$_GET["id_prov"]; $strSQL.=" ORDER BY comune"; // connessione al db $connessione=mysql_connect("localhost", "root", ""); $db=mysql_select_db("trinacria") OR DIE ("Impossibile connettersi al database"); $risultati=mysql_query($strSQL, $connessione) OR DIE ("Impossibile eseguire la query"); // scrivo la select per intero echo "<select title=\"selezionare il comune di appartenenza\" name=\"comune\" id=\"comune\"><option value=\"0\">-----Tutti-----</option>"; while ($rs=mysql_fetch_array($risultati)){ echo "<option value=\"".$rs["id_comune"]."\">".htmlentities($rs["comune"])."</option>"; } echo "</select>"; //$chiudi=mysql_close($connessione);
}
[/PHP]popolafraz.php
[PHP]
if (isset($_GET["id_comune"])){$strSQL="SELECT * FROM frazione"; if (is_numeric($_GET["id_comune"]) AND $_GET["id_comune"]>0) $strSQL.=" WHERE id_comune=".$_GET["id_comune"]; $strSQL.=" ORDER BY frazione"; // connessione al db $connessione=mysql_connect("localhost", "root", ""); $db=mysql_select_db("trinacria") OR DIE ("Impossibile connettersi al database"); $risultati=mysql_query($strSQL, $connessione) OR DIE ("Impossibile eseguire la query"); // scrivo la select per intero echo "<select title=\"selezionare la frazione di appartenenza\" name=\"frazione\" id=\"frazione\"><option value=\"0\">-----Tutti-----</option>"; while ($rs=mysql_fetch_array($risultati)){ echo "<option value=\"".$rs["id_fraz"]."\">".htmlentities($rs["frazione"])."</option>"; } echo "</select>"; $chiudi=mysql_close($connessione);
}
[/PHP]
-
Non è che per caso c'è qualche apice nei parametri che passi alle funzioni js?
-
L'html caricato con ajax, cioè <select...., non ha più l'evento onchange.
Inoltre, credo che bisogna gestirlo esternamente al tag select caricato con ajax.