Sempre più spesso, le applicazioni web offrono agli utenti la possibilità di ottenere dei suggerimenti rapidi sui contenuti inseriti nei campi da completare, in modo da velocizzare le ricerche delle informazioni e aumentare la comodità d'uso.
Il plug-in
Autocomplete di jQuery abilita l'utente a ottenere
proposte riguardo i contenuti da ricercare fornendo dei
criteri di suggerimento e
filtraggio per ogni termine.
L'
algoritmo impiegato dal plug-in inizia a cercare un possibile
matching con un database non appena l'utente inserisce la prima parola da trovare, aggiungendo poi filtri successivi e più mirati se quest'ultimo arricchisce le informazioni scrivendo altri caratteri; data la sua efficienza, può essere impiegato per completare indirizzi, nomi di città e account.
Nel caso di piccole quantità di dati da ricercare, il plug-in può anche essere utilizzato in locale, mentre è consigliabile farlo da remoto se l'applicazione necessita di un database particolarmente ampio.
La proprietà più importante del plug-in, di cui è anche possibile scaricare del
codice dimostrativo è
source, che contiene i valori da suggerire e che può essere riferita a un vettore, un URL o un metodo.
Nella situazione in cui la proprietà sia riferita a un vettore JavaScript, la forma di quest'ultima deve essere del tipo:
[ 'voce 1', 'voce N' ], quindi un esempio potrebbe essere quello presentato nel seguito:
[code=c]<je:Autocomplete ID="aA" runat="server" Source="[ 'programma','programmazione','programmazione.it' ]">
</je:Autocomplete>[/code]
Questo codice consente di visualizzare i suggerimenti specificati quando viene riconosciuta una sequenza di caratteri valida inserita dall'utente. I suggerimenti possono essere inseriti anche
tramite URL, che ritorna comunque un vettore:
[code=javascript]<je:Autocomplete ID="aA" runat="server"
Source="'http://esempio.com/source.js'">
</je:Autocomplete>[/code]
Se si sceglie questa strada occorre fare attenzione a utilizzare gli apici singoli per racchiudere l'indirizzo altrimenti verrà generato un errore. L'ultima possibilità, la più comoda da usare, è quella basata sul metodo che utilizza
SourceAsync e richiama il file contenente l'intero
dataset dalla posizione indicata solo all'occorrenza.
[code=javascript]<je:Autocomplete ID="k" runat="server"
SourceAsync-Url="google_getitem.ashx">
</je:Autocomplete>[/code]