单击按钮时筛选下拉列表的jQuery和引导文本字段

Question

我正在尝试创建一个搜索框。当用户点击搜索时，根据输入的字符，它会在一个可以选择的下拉列表中显示匹配的结果。WHen用户选择项目，它将填充到表单提交的输入框中。请看下面我需要的图片。我正在使用jQuery和Bootsrap，但我似乎不能让它去。

这是我的代码。我还使用jquery切换下拉菜单，这是可行的。

<input list="list" class="form-control" placeholder="Search for item" name="item-search" id="item-search"><span class="input-group-btn"><button class="btn" id="apply-btn" type="button">Apply</button></span>
<ul class="dropdown-menu" role="menu" id="list-dropdown-items"></ul>
<li><a value="value1">value1</a></li>
<li><a value="value2">value2</a></li>
<li><a value="value3">value3</a></li>
<li><a value="value4">value4</a></li>
<li><a value="value5">value5</a></li>
<li><a value="value6">value6</a></li>

textbox with dropdown filter

Answer 1

你可以试试这个：

https://harvesthq.github.io/chosen/

这是一个功能更强大的搜索框/下拉框插件，有很多功能。我一直在为我正在做的项目使用它，它对过滤非常有用。