Press "Enter" to skip to content

jQuery Easy Autocomplete: un plugin completo e semplice da usare

Condividi il post con i tuoi amici o colleghi

Una delle caratteristiche più utili e apprezzate per un motore di ricerca è la sua capacità di offrire dei suggerimenti a chi effettua una ricerca. Google Suggest ci ha ben abituati in tal senso. Per questo, all’interno delle applicazioni che sviluppiamo, un sistema autocomplete per il motore di ricerca sarà ben apprezzato da chi utilizza l’applicazione.

Esistono molte librerie che permettono di implementare rapidamente un sistema autocomplete. La più famosa è probabilmente typeahead.js e molto apprezzata è anche Awesomplete. Un’altra libreria molto completa e semplice da usare è EasyAutocomplete. Supporta suggerimenti da locale o remoto in JSON, XML e plain text. Ha molte configurazioni ed eventi da poter utilizzare ed offre una serie di template.

Si fa apprezzare anche per la chiarezza della documentazione oltre alla semplicità di utilizzo essendo un plugin di jQuery. Di seguito un esempio di implementazione che prevede il caricamento di dati da un JSON remoto e un evento al click sull’elemento scelto:

var options = {
          url: "https://jsonplaceholder.typicode.com/users",
        
          getValue: "name",
        
          list: {
            match: {
              enabled: true
            },
            onClickEvent: function() {
              var value = $("#users").getSelectedItemData().name;
              $('#selection').html('Selected user: ' + value + '');
            }	
          }
        };

$("#users").easyAutocomplete(options);

Puoi visionare qui la demo. Per non perdere i prossimi articoli iscriviti alla newsletter o seguimi su Facebook e Twitter.

Al prossimo articolo 😉


Condividi il post con i tuoi amici o colleghi