预先输入不显示远程数据的结果

时间:2016-03-29 20:57:52

标签: jquery typeahead bloodhound

Typeahead未显示建议​​。这是一个非常简单的城市查找。数据库返回正常。控制台正在记录我的输入。只是无法获取要显示的返回数据。

    remote data
{"recID":"3699","Name":"Dupage","City":"West Chicago","Country":"United States"}


html
<input class="typeahead" type="text" placeholder="Enter City" size="32">


script
<script type="text/javascript">         
var cities = new Bloodhound({
  datumTokenizer: Bloodhound.tokenizers.obj.whitespace('City'),
  queryTokenizer: Bloodhound.tokenizers.whitespace,
  prefetch: 'getAirports.php',
  remote: {
    url: 'getAirports.php?query=%QUERY',
    wildcard: '%QUERY'
  }
}); 

$('.typeahead').typeahead({
  hint: true,
  highlight: true,
  minLength: 1
}, {
  name: 'City',
  display: 'City',
  source: cities,
  templates: {
    suggestion: function (data) {
        return  data.City;
    }
}

}); 
         </script>  

1 个答案:

答案 0 :(得分:0)

远程数据的格式不正确。它不是有效的JSON对象。它也不是一个有效的JavaScript数组。您可能能够使它工作,但它需要您解析返回的数据以创建对象或数组。

如果您的数据作为对象返回:{recID:"3699", Name:"Dupage", City:"West Chicago", Country:"United States"},那么它应该可以正常工作。现在你试图引用一个不存在的对象data.City