115

我有一个要求，我必须使用引导自动完成下拉菜单，但如果用户愿意，他们可以在该下拉菜单中拥有自由格式的文本。在您考虑 TypeAhead 之前，我可以使用 Bootstrap TypeAhead 文本框，但我需要有下拉菜单，因为我们想提供一些默认值作为 headstart 选项，以防用户不知道要搜索什么。

我将它与 MVC DropDownListFor 一起使用，因为它为我们创建了一个选择控件。

我发现这篇文章对我有用。

https://github.com/danielfarrell/bootstrap-combobox/pull/20

我所要做的就是从选择控件中删除名称，然后控件让我输入自由格式的文本。到目前为止一切都很好。

现在，我将它与 Knockoutjs 结合使用。我将我的选项和选定的值绑定到选择控件，然后在我的模板呈现的行上，我调用 (selector).combobox() 这使选择控件成为引导组合框并添加输入控件并在场景中隐藏选择控件在后面。

现在的问题是，当我尝试将他的值发布到服务器时，由于我在输入框中输入的值不是我为选择控件提供的选项中的有效选项，因此默认情况下它始终将其设置为第一个选项。这是因为，我在选择控件上设置了选定值的绑定，而不是在 bootstrap-combobox.js 创建的输入框上。

我的问题是如何让输入框数据绑定到与选择控件绑定的相同属性。

还有其他选择吗？？如果您需要更多说明或有疑问，请告诉我。请建议。

谢谢。

4

6 回答 6

255

看看Select2 的 Bootstrap。它应该能够做你需要的一切。

另一个不错的选择是Selectize.js。Bootstrap 感觉有点原生。

于 2012-10-16T12:31:57.193 回答
26

基本的 HTML5 数据列表是否有效？它很干净，您不必玩弄乱七八糟的第三方代码。W3SCHOOL 教程

MDN 文档非常有说服力并提供示例。

于 2013-08-01T15:40:33.873 回答
3

用于 Bootstrap 3 原生插件的 Select2

https://fk.github.io/select2-bootstrap-css/index.html

这个插件使用 select2 jquery 插件

nuget

PM> Install-Package Select2-Bootstrap

于 2014-11-11T05:58:03.057 回答
1

Fuel UX 组合框具有您期望的所有功能。

于 2013-08-14T13:09:23.170 回答
1

我可以建议http://www.jqueryscript.net/form/Twitter-Like-Mentions-Auto-Suggesting-Plugin-with-jQuery-Bootstrap-Suggest.html吗，更像是推特帖子建议，它给你一个列表基于@或#标签的用户或主题，

在此处查看演示：http ://www.jqueryscript.net/demo/Twitter-Like-Mentions-Auto-Suggesting-Plugin-with-jQuery-Bootstrap-Suggest/

在这个中，您可以轻松地将 @ 和 # 更改为您想要的任何内容

于 2015-05-11T19:43:46.843 回答
0

Bootstrap Tokenfield 似乎也不错：http ://sliptree.github.io/bootstrap-tokenfield/

于 2016-01-21T18:50:06.190 回答