Typeahead montre toujours seulement 5 suggestions maximum

J'ai le code ci-dessous à l'aide de Typeahead.js pour des suggestions. Je n'ai pas de problèmes majeurs sur le code tel qu'il fonctionne très bien.

Le problème mineur, je fais face, c'est que un moment donné, je ne vois que 5 suggestions, même si il y a plus de 5 suggestions à partir de l'URL distante.

var isearch = new Bloodhound({
    datumTokenizer: function(d) { 
         return Bloodhound.tokenizers.whitespace(d.value); 
    },
    queryTokenizer: Bloodhound.tokenizers.whitespace,
    remote: "http://localhost/search/get-data/%QUERY"
});

isearch.initialize();  

$("#search_box .typeahead").typeahead(null,{ name: "isearch",
    displayKey: "value",
    source: isearch.ttAdapter(),
    templates: {
         suggestion: Handlebars.compile("{{value}}")
    }
});

Ce que j'attends c'est qu'il y a plus de suggestions, il devrait y avoir une barre de défilement pour les utilisateurs de voir.

InformationsquelleAutor Purus | 2014-06-01
  1. 53

    Dans Typeahead version 0.11.1:

    Spécifier "limite" lors de l'instanciation de l'typeahead objet de définir le nombre de suggestions pour afficher par exemple

    //Instantiate the Typeahead UI
$('.typeahead').typeahead(null, {
 limit: 10, //This controls the number of suggestions displayed
 displayKey: 'value',
 source: movies
});

    Voir un exemple ici:

    http://jsfiddle.net/Fresh/ps4w42t4/

    Dans Typeahead version 0.10.4.

    Le Limier suggestion moteur a une valeur par défaut de cinq pour la "limite" de l'option (c'est à dire Le nombre maximum de suggestions pour le retour du Chien de saint-hubert#get)

    Vous pouvez augmenter la limite en spécifiant la valeur souhaitée lorsque vous instanciez votre Chien de saint-hubert objet. Par exemple, pour spécifier une limite de 10:

    var isearch = new Bloodhound({
 datumTokenizer: function(d) { 
     return Bloodhound.tokenizers.whitespace(d.value); 
 },
 queryTokenizer: Bloodhound.tokenizers.whitespace,
 remote: "http://localhost/search/get-data/%QUERY",
 limit: 10
});

    Un exemple d'une instance de Typeahead où la limite est fixée à 10 peut être trouvé ici:

    http://jsfiddle.net/Fresh/w03a28h9/

    • Merci pour le lien. J'ai déjà vu cela. Ce que je voulais, c'est avoir une barre de défilement quand il y a plus d'éléments. Limite totale = 10 et l'affichage = 5 éléments. pour les autres éléments il convient d'utiliser la barre de défilement.
    • Ce que vous attendez n'est pas mis en œuvre par typeahead. Ma réponse va vous permettre d'augmenter le chiffre qui est la seule façon vous pouvez le faire à l'instant.
    • J'ai joué avec CSS et finalement obtenu. Merci.
    • OK, content que vous avez trouvé une solution. Vous devez répondre à votre propre question à aider les autres qui ont le même problème.
    • Assurez-vous. Je suis juste à expérimenter davantage. Je vais poster la solution une fois que je reçois correctement.
    • J'ai posté ma réponse 🙂
    • est-il possible d'afficher les suggestions sans aucune limite?
    • Vous pourriez obtenir la taille de votre télécommande ensemble de données, puis utiliser cette valeur lors de l'instanciation de Chien de saint-hubert. Cependant, pourquoi voudriez-vous faire cela, que le retour de toutes les données de ralentir la page que vous aurez besoin de récupérer toutes les données?
    • ouais besoin de montrer à toute proposition tant qu'utilisateur, de l'exigence de client. Alors seulement. merci pour votre réponse. 🙂
    • Version 0.11.1 - limit n'est pas une option sur le Chien de saint-hubert . sufficient est une option , mais c'est pour le tir remote pour remblayer des suggestions. Si vous utilisez bloodhound + TT puis utilisez limit en TT 'dataset` option pour le contrôle des suggestions

    InformationsquelleAutor Ben Smith
  2. 36

    Dans mon cas "limite" option travaillé, mais de manière différente. J'ai dû mettre à limiter option sur typeahead au lieu de Limier. Je suis de poster mon cas, de sorte qu'il pourrait aider quelqu'un.

    bloodhoundSuggestionEngine = new Bloodhound({
datumTokenizer : function(d) {
return Bloodhound.tokenizers.whitespace(d.key);
},
queryTokenizer : Bloodhound.tokenizers.whitespace,
local : myOptions
});

$("#myinputbox").typeahead({
minLength : 3,
highlight : true
}, {
displayKey : 'key',
source : bloodhoundSuggestionEngine.ttAdapter(),
limit: 10
});
    • Autant que je me souvienne, depuis la version 0.11 du chien de saint-hubert, la limite a été supprimée en option. Je pense que n'est qu'une option sur typeahead
    • semble comme ils ne cessent de changer, il va et vient
    • Grâce Atul, Cela a fonctionné
    • Ce travail est en 0.11.1
    InformationsquelleAutor Atul Kumbhar
  3. 4

    En dehors de l'ajout de la limite pour le Chien de saint-hubert instanciation comme suggéré par @Douce, je l'ai fait ci-dessous style dans le CSS pour obtenir le résultat souhaité.

    .tt-suggestions {
  min-height: 300px;
  max-height: 400px;  
  overflow-y: auto;
}

    Ce que j'ai fait est de forcer le conteneur à 400px de sorte que je reçois une barre de défilement quand il y a plus de résultats. Je voulais cette approche, car, je ne voulais pas l'écran pour prendre plus d'espace. Ça va marcher, même si il y a 100 résultats.. et de ne pas obstruer l'écran.

    InformationsquelleAutor Purus
  4. 3

    Dans Typeahead version 0.11.1:

    Spécifier "limite" lors de l'instanciation de l'typeahead objet de définir le nombre de suggestions à l'écran, mais assurez-vous qu'il est un de moins que le nombre maximum de votre source de renvoie la.

    //Instantiate the Typeahead UI
$('.typeahead').typeahead(null, {
    limit: 9, //one less than your return value. This controls the number of suggestions displayed
    displayKey: 'value',
    source: movies
});

    voir https://github.com/twitter/typeahead.js/issues/1201

    • Cela a résolu pour moi. Merci!
    InformationsquelleAutor BusyBee
  5. 2

    Une autre façon peut-être est de changer les valeurs par défaut dans Typeahead classe directement.

    $.fn.typeahead.defaults = {
    ...
    items: 8,
    ...}

    à

    items: 'all'

    InformationsquelleAutor argoden
  6. 0

    @Atul réponse m'a vraiment aidé, mais j'ai eu un autre problème avec le chien de saint-hubert. J'ai été à l'aide d'une télécommande et je ne serais pas obtenir les résultats que je sais que la distance serait de servir. C'est parce qu'elle a trouvé quelque chose d'assez près dans le limier cache et n'est pas demander à la distance pour les données. Donc, en se cognant la sufficient option sur limier de la valeur par défaut de 100, il est toujours à la demande de la télécommande pour plus de données.

    InformationsquelleAutor viggity