Bootstrap 3 typeahead Ajax

Question

J'utilise https://github.com/bassjobsen/Bootstrap-3-Typeahead

Mon code:

<input type="text" class="typeahead" autocomplete="off"> 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script> 
<script> 
$(document).ready(function() { 
    $('.typeahead').typeahead({ 
     autoSelect: true, 
     minLength: 2, 
     delay: 400, 
     source: function (query, process) { 
      $.ajax({ 
       url: '/search/searchCities', 
       data: {q: query}, 
       dataType: 'json' 
      }) 
       .done(function(response) { 
        console.log(response.data); 
        return process(response.data); 
       }); 
     } 
    }); 
}); 
</script> 

Mon code backend renvoie un objet JSON comme

{status: "OK", data: ["Moscow", "New York", "Odessa"]} 

par code php

<?= echo json_encode(["status" => "OK", "data" => ["Moscow", "New York", "Odessa"]]) ?> 

Après avoir tapé 2 ou m lettres minerai dans l'entrée il y a une erreur dans la console du navigateur comme celui-ci

GET http://localhost/search/searchCities?q=mo 200 OK 
TypeError: a is undefined 
...rep:function(a,b,c){for(var d,e=[],f=0,g=a.length,h=!c;g>f;f++)d=!b(a[f],f),d!==... 

jquery.min.js (row 2, col 3476) 
["Moscow"] 

Je vois le menu déroulant avec l'option « Moscou », je peux choisir et tout irait bien si je ne l'avais pas eu l'erreur dans la console. S'il vous plaît, montrez-moi mon erreur.

J'ai essayé d'utiliser jquery.js (pas la version min). L'erreur était

TypeError: elems is undefined 
length = elems.length, 

jquery.js (row 459, col 4) 

Je suppose que quelque chose ne va pas avec le type de données, mais je ne peux pas le trouver par moi-même.

Answer 1

Il s'est avéré qu'il y a une erreur dans bootstrap3-typeahead.min.js Si j'utilise bootstrap3-typeahead.js - aucune erreur dans la console du navigateur.