jquery - Typeahead returns data but doesn't display anything -

i have code retrieving locations , can see data returned fine using console.log. however, it's not being displayed anywhere user choose. can't figure out missing.

<input id="cl_hotellocation" name="cl_hotellocation" type="text" placeholder="where to?" class="input-xlarge form-control typeahead"> 

var locations = new bloodhound({     datumtokenizer: function (datum) {         return bloodhound.tokenizers.whitespace(datum.name);     },     querytokenizer: bloodhound.tokenizers.whitespace,     limit: 5,     remote: {         url: "/api/typeahead/search/",         replace: function(url, query) {             return url + query;         },         filter: function (locations) {             return $.map(locations, function (data) {                 console.log("1", data);                 return {                     tokens: data.tokens,                     symbol: data.locationid,                     name: data.locationname+ ", " + data.regionname + ", " + data.countryname                 }             });         }     } });  locations.initialize();  $('.typeahead').typeahead(null, {     name: 'locations',     displaykey: 'name',     minlength: 3, // send ajax request after user type in @ least x characters     source: locations.ttadapter() });