javascript - 强制从数据列表或等效项（文本输入）中选择

Question

以下代码用于订购项目，它允许用户自由输入，但它包含从我的数据库填充的数据列表，因此如果他们开始输入其中一个项目，它将弹出。我想强制文本输入只接受来自数据库的项目。我怎样才能做到这一点？

<input id="prevName" type="text" list="menuItems">
    <datalist id="menuItems">
        {% for item in menuItems %}
        <option>{{item.name}}</option>
        {% endfor %}
    </datalist>
</input>

自动完成或其他更适合？

Answer 1

您应该使用Chosen而不是它，因为即使是 bootstrap 的 typehead 插件也不能满足您的需求。

Answer 2

Autocomplete总是更适合于此，因为您始终可以针对用户输入的无效条目进行验证，并且您还可以强制文本输入接受数据库将提供给用户的内容。