twitter bootstrap liste déroulante / liste déroulante à remplissage automatique avec Knockoutjs
J'ai une exigence où je dois utiliser bootstrap liste déroulante à remplissage automatique, MAIS l'utilisateur peut avoir du texte sous forme libre dans cette liste déroulante s'il le souhaite. Avant de penser à TypeAhead, je pourrais utiliser Bootstrap Zone de texte TypeAhead, mais j'ai besoin du menu déroulant car nous voulons donner des valeurs par défaut comme options de départ au cas où les utilisateurs ne sauraient pas quoi rechercher.
J'utilise ceci avec MVC DropDownListFor car cela crée un contrôle de sélection pour nous.
J'ai trouvé cet article qui fait ça pour moi.
https://github.com/danielfarrell/bootstrap-combobox/pull/2
Tout ce que je devais faire était d'enlever le nom du contrôle de sélection et le contrôle me permettait d'entrer du texte libre. Tout va bien jusqu'à présent.
Maintenant, je l’utilise en conjonction avec Knockoutjs. Je lie mes options et ma valeur sélectionnée au contrôle de sélection, puis sur la ligne rendue de mon modèle, j’ai appelé (sélecteur) .combobox (), ce qui rend le contrôle de sélection une comobobox bootstrap et ajoute un contrôle de saisie et masque le contrôle de sélection dans les scènes derrière.
Le problème maintenant, c’est lorsque j’essaie d’obtenir les valeurs à publier sur le serveur, car la valeur que j’ai mise dans la zone de saisie n’est pas une option valide parmi les options que j’ai données pour la sélection du contrôle; elle est toujours définie par défaut sur la première option. C'est parce que je règle la liaison de la valeur sélectionnée sur select control et non sur la zone de saisie créée par bootstrap-combobox.js.
Ma question est de savoir comment obtenir la zone de saisie pour lier des données à la même propriété que le contrôle de sélection était lié à.
Toute autre option ?? Faites-moi savoir si vous avez besoin de précisions ou si vous avez des questions. Veuillez suggérer.
Merci.
Regardez Select2 pour Bootstrap . Il devrait être capable de faire tout ce dont vous avez besoin.
Une autre bonne option est Selectize.js . Il semble un peu plus natif à Bootstrap.
Le datalist HTML5 de base fonctionne-t-il? C'est propre et vous n'avez pas à jouer avec le code tiers malpropre. tutoriel W3SCHOOL
Le documentation MDN est très éloquent et propose des exemples.
Sélectionnez 2 pour Bootstrap 3 plug-in natif
https://fk.github.io/select2-bootstrap-css/index.html
ce plugin utilise le plugin select2 jquery
pépite
PM> Install-Package Select2-Bootstrap
Combobox Fuel UX a toutes les fonctionnalités que vous attendez.
Puis-je suggérer http://www.jqueryscript.net/form/Twitter-Like-Mentions-Auto-Suggesting-Plugin-with-jQuery-Bootstrap-Suggest.html , fonctionne plus comme le post Twitter suggestion où il vous donne une liste d'utilisateurs ou de sujets basés sur les balises @ ou #,
voir la démo ici: http://www.jqueryscript.net/demo/Twitter-Like-Mentions-Auto-Suggesting-Plugin-with-jQuery-Bootstrap-Suggest/
dans celui-ci, vous pouvez facilement changer le @ et le # en tout ce que vous voulez
Bootstrap Tokenfield semble bon aussi: http://sliptree.github.io/bootstrap-tokenfield/