jQuery: popolare una ComboBox tramite json

Piccolo snippet, mi è stato utile nello sviluppo di una applicazione PhoneGap realizzata con jQuery Mobile.

Per caricare i dati di una combobox partendo da un array json (jsonp, nel nostro caso) abbiamo bisogno di codice lato client:

function caricaCombo() {
	$.getJSON("http://www.tuosito.com/api/get.php?callback=?", function(result) {
		$.each(result, function() {
			$("#IDComboDaPopolare").append($("<option />").val(this.id).text(this.valore));
		});
   });
}

e di un semplice script lato server (get.php) che si occupi di ‘pescare’ dati dal database e serializzare i risultati in json:

<?php
$query = "SELECT id, descrizione from Dati";
$result = mysql_query($query);
$dati= array();
while ($row=mysql_fetch_array($result)) {
	if ($row[1] != $row[2]) {
	$tempAr = array("id" => $row[0], "valore"=>$row[1]);
	$dati[]= $tempAr;
	}
}
echo $_GET['callback'] . '(' . json_encode($dati) . ')';
?>

Filed under: featured, jQuery, PHP Tagged: jQuery, jquery mobile, phonegap, PHP