disign.it | Jquery: autocompletamento campo | a digital sign for a best design!
A digital sign for a best design
Javascript 5.409 visualizzazioni

Jquery: autocompletamento campo

29/03/2012

Un'altra opzione semplice ma molto utile da implementare, l'autocompletamento di un campo sulla base di termini predefiniti.

Come sempre occorre prima di tutto caricare l'ultima versione di Jquery, (qui l'articolo), subito dopo aggiungere altri quattro js, jquery.ui.core.js, jquery.ui.widget.js, jquery.ui.position.js, jquery.ui.autocomplete.js (download qui).

Al document ready utilizzare questa sintassi sostituendo il nome del campo input (nell'esempio chiamato tags), con quello di interesse nel proprio codice (la variabile contenente i diversi termini può naturalmente esser popolata attraverso la selezione dei termini diponibili nella tabella del db di riferimento):

 

$(function() {
        var availableTags = [
            "ActionScript",
            "AppleScript",
            "Asp",
            "BASIC",
            "C",
            "C++",
            "Clojure",
            "COBOL",
            "ColdFusion",
            "Erlang",
            "Fortran",
            "Groovy",
            "Haskell",
            "Java",
            "JavaScript",
            "Lisp",
            "Perl",
            "PHP",
            "Python",
            "Ruby",
            "Scala",
            "Scheme"
        ];
        $( "#tags" ).autocomplete({
            source: availableTags
        });
    });

 

Infine operate sul css per definire l'apetto dei suggerimenti!

← PHP: preg_replace per eliminare link o tag indesiderati in testo immesso Jquery: loader per immagini →

Invia una domanda o un commento sull'articolo

I campi obbligatori sono segnalati *

*

*



 

© 2009 - 2017 Impronte digitali di Luca Frassineti. Tutti i diritti riservati.