Skip to content

Instantly share code, notes, and snippets.

@janoulle
Forked from geuis/remote-typeahead.js
Created November 24, 2012 16:07
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save janoulle/4140309 to your computer and use it in GitHub Desktop.
Save janoulle/4140309 to your computer and use it in GitHub Desktop.
Remote data querying for Twitter Bootstrap 2.0 Typeahead without modifications
<script>
// Charles Lawrence - Feb 16, 2012. Free to use and modify. Please attribute back to @geuis if you find this useful
// Twitter Bootstrap Typeahead doesn't support remote data querying. This is an expected feature in the future. In the meantime, others have submitted patches to the core bootstrap component that allow it.
// The following will allow remote autocompletes *without* modifying any officially released core code.
// If others find ways to improve this, please share.
<!-- Typeahead by Charles Lawrence https://gist.github.com/1848558-->
<script type="text/javascript">
var autocomplete = $('#stops').typeahead()
.on('keyup', function(ev){
ev.stopPropagation();
ev.preventDefault();
//filter out up/down, tab, enter, and escape keys
if( $.inArray(ev.keyCode,[40,38,9,13,27]) === -1 ){
var self = $(this);
//set typeahead source to empty
self.data('typeahead').source = [];
//active used so we aren't triggering duplicate keyup events
if( !self.data('active') && self.val().length > 0){
self.data('active', true);
//Do data request. Insert your own API logic here.
$.getJSON("/data.json",{
q: $(this).val()
}, function(data) {
//alert(data.stopnames);
//set this to true when your callback executes
self.data('active',true);
//Filter out your own parameters. Populate them into an array, since this is what typeahead's source requires
var arr = [],
i=data.SETNAME.length;
while(i--){
arr[i] = data.SETNAME[i];
}
//set your results into the typehead's source
self.data('typeahead').source = arr;
//trigger keyup on the typeahead to make it search
self.trigger('keyup');
//All done, set to false to prepare for the next remote query.
self.data('active', false);
});
}
}
});
</script>
<!--End Typeahead -->
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment