Popolare select dinamiche con AJAX

**aerozep** · 04-05-2006, 13:11

Visto che siamo in tema:
vorrei proporre una soluzione che però non mi riesce e vorrei implementare:
sul vostro esempio:
supponendo
di avere
<form name="ricerca">
<div id="comuni"></div>
<select name="comuni">
</select>
</form>
e lo script server che restituisce del codice javascript che genere dinamicamente gli options:
tipo:

ciclo
var Sel = document.ricerca.comuni;
$dati.= " var oOption = new Option(\"".$idcomune."\",\"".$comune."\");";
$dati.= "Sel.options.add(oOption);";
fine ciclo
echo $dati;

ora se prendo la risposta con la funzione con:
document.getElementById('comuni').innerHTML = output;

non mi esegue il codice javascript e quindi non mi crea gli options?
come mai?

**Cheope** · 04-05-2006, 19:02

@aerozep
Non so se ho capito quello che vuoi fare... O se ho capito non capisco l'utilità di fare un'operazione del genere... :master:
Comunque, tu vorresti generare lato server del codice Javascript da inserire nella pagina via XMLHttpRequest e farlo eseguire, giusto?
Mah, a prima vista non vedo controindicazioni...

Mi è un po' oscura la funzione js che hai scritto (ma forse usi qualche classettina tipo prototype...), perciò prima cosa da controllare è che funzioni di suo....
Non so se potrebbe fungere, ma prova a controllare se hai aggiunto il tag script a delimitare lo stringone js che invii dalla pag PHP...
E poi soprattutto controlla se fai la chiamata per eseguirlo: magari racchiudi tutto in una funzione (nella stringa js scritta da php) e da chiamare nella pagina principale, tipo dopo document.getElementById('comuni').innerHTML = output;...
Controlla anche che il codice passato sia js corretto e che non subisca variazioni strane nel passaggio...
Oppure ci vuole tipo un eval....
Non so se mi spiego...

Ma dopo tutto sto sbatti mentale, sarebbe meglio vedere il codice che hai scritto per intero! :rollo:

@Kellog15
Scusa ma son tornato stasera...
L'esempio che avevo fatto era province-comuni, non regioni-province...
Quello era Pietro09...

**Kellog15** · 04-05-2006, 19:04

mi andrebbe bene cmq..se puoi postarmelo ne sarei ancora contento..

**Cheope** · 05-05-2006, 16:58

Postato.

**Kellog15** · 05-05-2006, 19:26

non mi è ancora arrivato nulla..me le potresti rimandare al mio indirizzo e-mail...ti prego... è kellog15@hotmail.it

grazie 1000 ancora

**Kellog15** · 05-05-2006, 19:47

ciao scusa se ti rompo continuamente...qui non arriva nulla...forse è la mia posta che non funziona molto..nel caso se vuoi prova a rinviare al mio indirizzo, e dopo per scrupolo invia anche qui:
galata.azzolin@tin.it

scusa,so di essere un rompi ma non sai quanto mi fai felice se mi riposti la roba su tutti e 2 gli indirizzi...grazie ancora

**superpandino** · 24-05-2006, 13:56

Il mio problema è il solito select concatenate provincie comuni.
Scusate ma con php me la cavo ma su ajax (e per fare tutto in una pagina è l' unico modo vero? altrimenti?)non sono riuscito a chiarirmi molto le idee; riguardo allo script precedente mi potreste dire come inserirci i div e tutto il resto o se volete vi posto il mio codice.
Grazie mille alejev@inwind.it

**Cheope** · 26-05-2006, 00:05

Ecco il codice che ho mandato anche a Kellog15, così serve a tutti:

index.php
(la pagina principale contenente le select. Potrebbe esseer anche in html, ma io ho preferito riempire i valori iniziali con PHP)

codice:

<!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);
}
</script>
</head>

<body>
<h1>Esempio</h1>

	<form action="pagina.php" method="get">
	
	<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_provincia='+this.value);">
	<option value="">-----Tutte-----</option>
	<?
	$strProvince="SELECT id_provincia, provincia FROM province";
	// connessione al db
	$connessione=mysql_connect("localhost", "%", "");
	$db=mysql_select_db("prova") OR DIE ("Impossibile connettersi al database");
	$risultati=mysql_query($strProvince, $connessione) OR DIE ("Impossibile eseguire la query");
	// scrivo la select per intero
	while ($rs=mysql_fetch_array($risultati)){
		echo "<option value=\"".$rs["id_provincia"]."\">".$rs["provincia"]."</option>";
	}
	?>
	</select>

	<label for="comune" class="home">comune:</label>
	<span id="selectComune">
		<select title="selezionare il comune di appartenenza" name="comune" id="comune">
		<option value="">-----Tutti-----</option>
		<?
		$strComuni="SELECT id_comune, comune FROM comuni";
		$risultati2=mysql_query($strComuni, $connessione) OR DIE ("Impossibile eseguire la query");
		while ($rs=mysql_fetch_array($risultati2)){
			echo "<option value=\"".$rs["id_comune"]."\">".$rs["comune"]."</option>";
		}
		$chiudi=mysql_close($connessione);
		?>
		</select>
	</span>
	
	</form>
	
</body>
</html>

popola.php
(è la pagina PHP con la quale index.php comunica via XMLHttpRequest: viene mandato l'id della provincia selezionata, popola.php esegue la query e restituisce i risultati sotto forma di select completa di option)

Codice PHP:


if (isset($_GET["id_provincia"])){

  

    $strSQL="SELECT * FROM comuni";

    if (is_numeric($_GET["id_provincia"]) AND $_GET["id_provincia"]>0) $strSQL.=" WHERE id_provincia=".$_GET["id_provincia"];

    $strSQL.=" ORDER BY comune";

    // connessione al db

    $connessione=mysql_connect("localhost", "%", "");

    $db=mysql_select_db("prova") 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"]."\">".htmlentities($rs["comune"])."</option>";

    }

    echo "</select>";

    $chiudi=mysql_close($connessione);

        

}

**Cheope** · 26-05-2006, 00:12

sql
(ve ne scrivo solo una parte, solo per esempio, giusta perchè i comuni italiani sono più di 8000 e tutti non ci stanno in un post. Inoltre questi dati sono un po' vecchi...
La tabella province è in relazione uno a molti con la tabella comuni su id_provincia)

codice:

create database if not exists `prova`;

USE `prova`;

/*Table structure for table `comuni` */

CREATE TABLE `comuni` (
  `id_comune` int(11) unsigned NOT NULL auto_increment,
  `comune` char(50) default NULL,
  `CAP` char(6) default NULL,
  `codice` char(4) default NULL,
  `id_provincia` int(11) unsigned NOT NULL default '0',
  PRIMARY KEY  (`id_comune`),
  KEY `provincia` (`id_provincia`)
) ENGINE=MyISAM DEFAULT CHARSET=latin1;

/*Data for the table `comuni` */

insert into `comuni` values 
(79,'AGRIGENTO',' 92100','A089',1),
(82,'BIVONA',' 92010','A896',1),
(84,'CALAMONACI',' 92010','B377',1),
(95,'FAVARA',' 92026','D514',1),
(96,'GROTTE',' 92020','E209',1),
(97,'JOPPOLO GIANCAXIO',' 92010','E390',1),
(98,'LAMPEDUSA E LINOSA',' 92010','E431',1),
(99,'LICATA',' 92027','E573',1),
(101,'MENFI',' 92013','F126',1),
(104,'NARO',' 92028','F845',1),
(105,'PALMA DI MONTECHIARO',' 92020','G282',1),
(107,'RACALMUTO',' 92020','H148',1),
(112,'SAMBUCA DI SICILIA',' 92017','H743',1),
(121,'VILLAFRANCA SICULA',' 92020','L944',1),
(122,'ACQUI TERME',' 15011','A052',2),
(132,'BALZOLA',' 15031','A605',2),
(146,'CABELLA LIGURE',' 15060','B311',2),
(186,'DENICE',' 15010','D272',2),
(188,'FABBRICA CURONE',' 15050','D447',2),
(198,'GABIANO',' 15020','D835',2),
(208,'ISOLA SANT\'ANTONIO',' 15050','E360',2),
(209,'LERMA',' 15070','E543',2),
(211,'MALVICINO',' 15015','E870',2),
(235,'NOVI LIGURE',' 15067','F965',2),
(236,'OCCIMIANO',' 15040','F995',2),
(245,'PADERNA',' 15050','G215',2),
(262,'QUARGNENTO',' 15044','H104',2),
(264,'RICALDONE',' 15010','H272',2),
(271,'SALA MONFERRATO',' 15030','H677',2),
(290,'TAGLIOLO MONFERRATO',' 15070','L027',2),
(298,'VALENZA',' 15048','L570',2),
(312,'AGUGLIANO',' 60020','A092',3),
(315,'BARBARA',' 60010','A626',3),
(317,'CAMERANO',' 60021','B468',3),
(328,'FABRIANO',' 60042','D451',3),
(331,'GENGA',' 60040','D965',3),
(332,'JESI',' 60035','E388',3),
(333,'LORETO',' 60025','E690',3),
(334,'MAIOLATI SPONTINI',' 60030','E837',3),
(343,'NUMANA',' 60026','F978',3),
(344,'OFFAGNA',' 60020','G003',3),
(348,'POGGIO SAN MARCELLO',' 60030','G771',3),
(351,'ROSORA',' 60030','H575',3),
(352,'SAN MARCELLO',' 60030','H979',3);

/*Table structure for table `province` */

CREATE TABLE `province` (
  `id_provincia` int(11) unsigned NOT NULL auto_increment,
  `provincia` char(4) default NULL,
  PRIMARY KEY  (`id_provincia`)
) ENGINE=MyISAM DEFAULT CHARSET=latin1;

/*Data for the table `province` */

insert into `province` values 
(1,'AG'),
(2,'AL'),
(3,'AN');

**PiccioOne** · 31-05-2006, 14:26

Ciao, ho visto lo script ed è ottimo. Il punto è: caricare 8700 comuni da mysql non è poco... caricando da file si avrebbe uno snellimento o no?
Che dici? E' vero che con connessioni adsl caricare i 140kb di database non è un peso gravoso... ma per chi ha un 56k o isdn aspettare che si carichi tutta la pagina finche non ha caricato il db è pò gravoso...
Che ne dici?

Grazie
Lore

Discussione: Popolare select dinamiche con AJAX

Strumenti discussione

Ricerca discussione

Visualizza

aiuto su come realizzare doppia select provincie regioni

Permessi di invio