jQuery Easy Autocomplete: un plugin completo e semplice da usare

Pubblicato il 29 Gennaio 2018

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 😉

Ecco perchè non amo i Template Engine

jQuery, json e le Twitter API: un esempio pratico

ComboBox pronte all'uso: select nazioni, regioni e province

Condividi il post con i tuoi amici o colleghi