[JQUERY UI] - Autocomplete

[october]

ciao a tutti, sto provado ad usare il plugin di jQuery UI Autocomplate, ma mi manca la parte .php per l'estrazione dei dati; nell'esempio dello sviluppatore c'è costruito un Array ma non fa vedere come estrarre i dati da un db.

$q = strtolower($_GET["term"]);
if (!$q) return;
$items = array(
"Great [i]Bittern[/i]"=>"Botaurus stellaris",
"Little [i]Grebe[/i]"=>"Tachybaptus ruficollis",
"Black-necked Grebe"=>"Podiceps nigricollis",
"Little Bittern"=>"Ixobrychus minutus",
"Black-crowned Night Heron"=>"Nycticorax nycticorax",
"Purple Heron"=>"Ardea purpurea",
"White Stork"=>"Ciconia ciconia"
); 

il link del plugin che sto usando è questo: http://jqueryui.com/demos/autocomplete/

[loHacker]

Per il lato server ho usato una cosa del tipo (qui l'ho semplificata un po'):

$keyword = $_REQUEST['keyword'];

$results = //dati ottenuti dal database in base a $keyword

$suggestions = array ();
foreach ( $results as $row )
    $suggestions [] = $row->value;
}
    
//la funzione di php json_encode sarebbe meglio solo che non me lo formatta nel modo giusto
echo "{query:'$keyword',suggestions:['" . implode ( "','", $suggestions ) . "']}"; 

Questo è il mio javascript jQuery:

var options, a;
$(document).ready(function() {
	options = { serviceUrl:'http://mysite.com/search.php', delimiter: /(,)\s*/};
	a = $('#tags').autocomplete(options);
});

[daniele_dll]

il modulo Autocomplete di jQuery UI è al quanto buggato e poco flessibile dato che non è possibile utilizzare combinazioni più complesse tra chiavi e valori ... e gli stessi valori li vuole passati in forme particolari

La mia versione di autocomplete è un pò vecchiotta, ha almeno un anno, e non si integra quindi con il framework di jQuery.UI ... ovviamente se la cosa non vi preoccupa minimamente ecco qui il codice

http://www.daccii.it/private/jquery.autocomplete.zip

qui come la uso

    // Attiva l'autocompletamento per il nome dell'azienda
    $('FORM INPUT#building-city')
    
        // Disabilita l'auto completamento del campo
        .attr("autocomplete", "off")
        
        // Abilita l'autocompletamento del testo inserito
        .autocomplete(Site['Uri'] + 'Miscs/Cities',
        {
            mainField: 'Name',
            maxItemsToShow: 10,
            matchCase: false,
            matchSubset: false,
            queryStringParameter: 'search[Name]',
            extraParams:
            {
                json: 'json',
                time: (new Date()).getTime()
            },
            formatItem: function formatItem(row)
            {
                return row.Name + " (" + row.ProvinceCode + ")
<span style=\"color: gray;\">" +
                    row.CodePostal + ", " + row.Region + "</span>";
            }, onItemSelect: function (li)
            {
                // Imposta il valore nel campo del codice istat del comune
                $('FORM INPUT#building-city-codeistat').val(li.extra.CodeIstat);
            }
        })

Il codice è abbastanza semplice ... il primo parametro è l'url mentre il secondo è un oggetto contenente le opzioni di configurazione. Impostando il valore di mainField su un campo contenuto in un elemento del valore restituito dal server (che sia un array senza chiave, un array con singolo valore o un array di oggetti) gli si fa fare la ricerca li su.

Non so se nella Autocomplete nuova hanno già sistemato i bug che mi sono sistemato quindi direi che prima di provare il mio codice date un occhiata a quella ufficiale ovviamente