Tiny lightweight autosuggest / typeahead plugin for jQuery

This example is build on top of the HTML5 datalist element and uses webshims to polyfill and enhance the user interface.

Download/Fork/Repository

Documentation and API


<input data-remote-list="data.json"
   data-list-highlight="true"
   data-list-value-completion="true"
   class="static-remote" type="text" />

$('input.static-remote').remoteList({
	minLength: 0,
	maxLength: 0,
	select: function(){
		if(window.console){
			console.log($(this).remoteList('selectedOption'), $(this).remoteList('selectedData'))
		}
	}
});


	<input
	data-list-filter="!"
	class="geo-autocomplete" type="text" />

$('input.geo-autocomplete').remoteList({
	maxLength: 9,
	source: function(val, response){
		$.ajax({
			url: 'http://geo-autocomplete.com/api/country',
			dataType: 'jsonp',
			data: {
				q: val,
				key: '37693c',
				nl: true
			},
			success: function(data){
				$.each(data, function(i, item){
					item.value = item.country_name;
				});
				response(data);
			}
		});
	},
	select: function(){
		if(window.console){
			console.log($(this).remoteList('selectedOption'), $(this).remoteList('selectedData'))
		}
	}
});