twitter bootstrap autocomplete dropdown combobox with Knockoutjs

Question

I have a requirement where I HAVE TO use bootstrap autocomplete dropdown  BUT user can have free form text in that dropdown if they wish  Before you think about TypeAhead  I could use Bootstrap TypeAhead textbox  but I need to have the dropdown becasue we want to give some default values as headstart options in case users dont know what to search for    I am using this with MVC DropDownListFor as that creates a select control for us   I found this article which does that for me   https   github com danielfarrell bootstrap-combobox pull 20  All I had to do was take off the name from the select control and the control was letting me enter free form text  All good so far   Now  I am using this in conjunction with Knockoutjs  I bind my options and selected value to the select control and then on row rendered of my template  I called  selector  combobox   which makes the select control a bootstrap comobobox and adds an input control and hides the select control in the scenes behind   The problem now is when I try to get he values to post to server  since the value I put in input box is not a valid options from the options I gave to select control  it is always setting it to the first option by default  This is becasue  I set the binding of the selected value on select control and not on the input box which was created by bootstrap-combobox js    My question is how do I get the input box to data-bind to the same porperty as the the select control was bound to   Any other options   Let me know if you need more clarification or have questions  Please suggest    Thanks

User · Accepted Answer

Have a look at Select2 for Bootstrap  It should be able to do everything you need    Another good option is Selectize js  It feels a bit more native to Bootstrap

User · Answer

Does the basic HTML5 datalist work  It s clean and you don t have to play around with the messy third party code  W3SCHOOL tutorial  The MDN Documentation is very eloquent and features examples

User · Answer

Bootstrap Tokenfield seems good too  http   sliptree github io bootstrap-tokenfield

User · Answer

Select2 for Bootstrap 3  native plugin  https   fk github io select2-bootstrap-css index html  this plugin uses select2 jquery plugin    nuget  PM  Install-Package Select2-Bootstrap

User · Answer

Can i suggest http   www jqueryscript net form Twitter-Like-Mentions-Auto-Suggesting-Plugin-with-jQuery-Bootstrap-Suggest html  works more like the twitter post suggestion where it gives you a list of users or topics based on   or   tags    view demo here  http   www jqueryscript net demo Twitter-Like-Mentions-Auto-Suggesting-Plugin-with-jQuery-Bootstrap-Suggest   in this one you can easily change the   and   to anything you want

User · Answer

Fuel UX combobox has all the features you would expect

[autocomplete] twitter bootstrap autocomplete dropdown / combobox with Knockoutjs

Examples related to autocomplete

Examples related to combobox

Examples related to twitter-bootstrap

Examples related to knockout.js

Examples related to html.dropdownlistfor