раскрывающийся список автозаполнения Twitter bootstrap / combobox с Knockoutjs
У меня есть требование, где я должен использовать раскрывающийся список автозаполнения bootstrap, но пользователь может иметь текст свободной формы в этом раскрывающемся списке, если они хотят. Прежде чем вы подумаете о TypeAhead, я мог бы использовать Bootstrap typeahead textbox, но мне нужно иметь раскрывающийся список, потому что мы хотим дать некоторые значения по умолчанию в качестве параметров headstart в случае, если пользователи не знают, что искать.
Я использую это с MVC DropDownListFor, поскольку это создает элемент управления select для нас.
Я нашел это статья, которая делает это для меня.
https://github.com/danielfarrell/bootstrap-combobox/pull/20
все, что мне нужно было сделать, это снять имя с элемента управления select, и элемент управления позволял мне вводить текст свободной формы. Пока все хорошо.
теперь я использую это в сочетании с Knockoutjs. Я связываю свои параметры и выбранное значение с элементом управления select, а затем при отображении строки моего шаблона я вызвал (селектор).combobox (), который делает выбор управление загрузочным comobobox и добавляет элемент управления ввода и скрывает элемент управления select в сценах позади.
проблема теперь в том, когда я пытаюсь получить значения для отправки на сервер, так как значение, которое я помещаю в поле ввода, не является допустимым из параметров, которые я дал для выбора элемента управления, он всегда устанавливает его в первый вариант по умолчанию. Это потому, что я установил привязку выбранного значения на элементе управления select, а не на поле ввода, которое было создано bootstrap-combobox.js.
мой вопрос заключается в том, как получить поле ввода для привязки данных к тому же porperty, что и элемент управления select.
какие-то другие варианты?? Дайте мне знать, если вам нужно больше разъяснений или есть вопросы. Пожалуйста, предложите.
спасибо.
6 ответов
посмотреть Select2 для Bootstrap. Он должен быть в состоянии сделать все, что вам нужно.
еще один хороший вариант-это Selectize.js. Он чувствует себя немного более родным для Bootstrap.
работает ли базовый HTML5 datalist? Это чисто, и вам не нужно играть с грязным сторонним кодом... W3SCHOOL учебник
Select2 для Bootstrap 3 родной плагин
https://fk.github.io/select2-bootstrap-css/index.html
этот плагин использует плагин select2 jQuery
NuGet для
PM> установить-пакет Select2-Bootstrap
могу я предложить http://www.jqueryscript.net/form/Twitter-Like-Mentions-Auto-Suggesting-Plugin-with-jQuery-Bootstrap-Suggest.html, работает больше как предложение Twitter post, где он дает вам список пользователей или тем, основанных на @ или # tags,
посмотреть демо здесь: http://www.jqueryscript.net/demo/Twitter-Like-Mentions-Auto-Suggesting-Plugin-with-jQuery-Bootstrap-Suggest/
в этом вы можете легко изменить @ и # ничего вы хотите
Bootstrap Tokenfield тоже кажется хорошим:http://sliptree.github.io/bootstrap-tokenfield/