jQuery Girl
  1. jQuery Girl
  3. typeahead.js ne retournant pas tous les résultats
Intereting Posts
validation de la forme modale d’amorçage et des charges modales après le chargement du DOM Comment utiliser JQuery Datatable.net avec ASP.Net 4 Razor et Twitter Bootstrap Comment faire en sorte qu’une fonction attende la fin d’une animation? Peut-on utiliser delay () avec l’interface utilisateur de jQuery dialog.open ()? validation pour au moins une case à cocher innerHTML ne fonctionne pas correctement lorsqu’il est utilisé sur un object jQuery Comment modifier une image à l’aide de javascript (jQuery & iviewer) en ajoutant 1 à l’image incrémentielle de src Le plugin de liens TinyMCE 4 modal in non éditable Comment puis-je simuler un clic sur un bouton radio de jQuery UI? “Pager: true” vs “pager: #someid” dans jqGrid, comment les utiliser correctement? jQuery chaque renvoie jQuery onmouseover + onmouseout / survolez sur deux divs différents Comment afficher une carte Google en plein écran avec jQuery Mobile? jQuery glisser-déposer la validation de réponse correspondante Correction du défilement de la page

typeahead.js ne retournant pas tous les résultats

Je ne parviens pas à obtenir typeahead.js pour afficher tous mes résultats sur ma page Voici mon code: 

var places = new Bloodhound({ datumTokenizer: Bloodhound.tokenizers.whitespace, queryTokenizer: Bloodhound.tokenizers.whitespace, remote: { url: '/api/place/?country={{ country.id }}&name=%QUERY' , transform: function (data) { return data.response; } , wildcard: '%QUERY' } }); var selected = false; $('.typeahead-place').typeahead({ hint: true, highlight: true, minLength: 2 }, { name: 'places', displayKey: function (obj) { if (obj.url != null && obj.url.length && (obj.street == null || obj.street.length == 0)) { return obj.name + " (Online store)"; } return obj.name + " (" + obj.street + ", " + obj.city + ", " + obj.postcode + ")"; }, source: places });

Exemple d’interrogation de Punn me renvoie le JSON du serveur en tant que: 

 { "response": [ { "id": "4", "name": "Punnitse ja Säästä 2", "street": "Simonkenttä, Simonkatu 9", "city": "Helsinki", "postcode": "00100", "url": "http://www.punnitse.fi/" }, { "id": "12", "name": "Punnitse ja Säästä 3", "street": "Simonkenttä, Simonkatu 9", "city": "Helsinki", "postcode": "00100", "url": "http://www.punnitse.fi/" }, { "id": "13", "name": "Punnitse ja Säästä 4", "street": "Simonkenttä, Simonkatu 9", "city": "Helsinki", "postcode": "00100", "url": "http://www.punnitse.fi/" }, { "id": "9", "name": "Punnitse ja Säästä Kamppi", "street": "Simonkenttä, Simonkatu 9", "city": "Helsinki", "postcode": "00100", "url": "http://www.punnitse.fi/" } ] }

En ce moment, cela se présente comme suit:

entrez la description de l'image ici

Cela semble être un bogue bien connu de la nouvelle version de typeahead.js . Pour que votre code fonctionne correctement, vous préférerez passer à la version 0.10.5 ou inférieure et transformer légèrement votre code: 

 var places = new Bloodhound({ datumTokenizer: Bloodhound.tokenizers.whitespace, queryTokenizer: Bloodhound.tokenizers.whitespace, remote: { url: '/api/place/?country={{ country.id }}&name=%QUERY', wildcard: '%QUERY', filter: function(data) { // <-- should use `filter` return data.response; } } }); places.initialize(); // <-- initialise suggestion $('.typeahead-place').typeahead({ hint: true, highlight: true, minLength: 2 }, { name: 'places', source: places.ttAdapter(), // <-- get adapter as a source displayKey: function(obj) { // ... } });

DEMO: https://jsfiddle.net/uszcp6j3/

Si vous souhaitez vous en tenir à la dernière version, vous pouvez appliquer le correctif suivant , publié il y a quelque temps, au code source du typeahead.js .

Je viens de trouver la réponse à cette question ici: https://github.com/twitter/typeahead.js/issues/1232 tel que fourni par louy : 

 ... $('.typeahead-place').typeahead({ hint: true, highlight: true, minLength: 2, limit: Infinity }, ...

… ce qui revient à dire que vous devez définir la limite de la propriété Javascript globale Infinity . Cela fonctionne totalement!

Cela dit, le fait qu’ils n’aient pas encore corrigé le code est un crime. Ce bogue est connu depuis des années .