Lightweight Autocomplete / Typehead JavaScript Library – ka-autocomplete

Category: Form , Javascript | May 21, 2015
Views Total:606 views
Official Page:Go to website
Last Update:May 21, 2015


Lightweight Autocomplete / Typehead JavaScript Library – ka-autocomplete


ka-autocomplete is a pure vanilla JavaScript library used toadd autocomplete / typehead functionality to textbox. Enter a character and you will see the list populate with suggestions.

How to use it:

Load the necessary JavaScript and stylesheet in your document.

<link rel="stylesheet" href="css/ka-autocomplete.css">
<script src="js/ka-autocomplete.js"></script>

Create a list of suggestions.

var list = [
    'The Beatles',
    'The Doors',  
    'Led Zeppelin',
    'Pink Floyd',
    'The Rolling Stones',
    'Jefferson Airplane',
    'The Who',
    'Lynyrd Skynyrd',
    'Guns N Roses',
    'Black Sabbath',
    'Creedence Clearwater Revival',
    'Bad Company',
    'The Velvet Underground',
    'Bob Dylan',
    'The Kinks',
    'Iron Maiden',
    'The Allman Brothers Band',
    'Deep Purple',
    'The Black Keys',
    'The Clash',
    'Def Leppard',
    'Simon & Garfunkel',
    'Motley Crue'

Initialize the autocomplete / typehead plugin on target container.

var kaAutocompleteWrapper = document.getElementById('ka-autocomplete');
kaAutocomplete.create(kaAutocompleteWrapper, list);

You Might Be Interested In:

Leave a Reply