简体   繁体   English

jQuery作为用户类型进行搜索,并可以选择多个值

[英]Jquery to search as user types and have the option to select multiple values

I am trying to build this search feature where as user types in a text box i query the server and bring suggestions and show it as a list of options to chose from. 我正在尝试构建此搜索功能,其中当用户在文本框中键入内容时,我会查询服务器并提出建议,并将其显示为可供选择的选项列表。

Also multiple selections is expected. 还期望有多个选择。 Like when we type in the to box of gmail it gives us multiple options we select one than we can start typing again and it will show more options related to the new entry. 就像当我们在gmail的“收件人”框中键入内容时一样,它为我们提供了多个选择,而我们无法再次开始输入,因此它将显示与新条目相关的更多选项。

The server responds in a json format as 服务器以json格式响应

{
"success": "true",
"suggestions": [
    "abc",
    "abd"
]}

I tried using this plugin but the response from server is expected here in a complicated format (which includes image link etc). 我尝试使用此插件,但是服务器的响应在这里应该是复杂的格式(包括图像链接等)。 so it didn't work out. 所以它没有解决。

https://github.com/guille/TextboxList https://github.com/guille/TextboxList

I tried using some other plugins also but most of them dont have the feature to query the database. 我也尝试过使用其他一些插件,但是大多数插件都没有查询数据库的功能。

I know that almost all major websites have this feature so there has be a good optimized way to do this. 我知道几乎所有主要的网站都具有此功能,因此已经有一种很好的优化方法。 Can you please tell me how to get this done. 你能告诉我如何做到这一点吗?

Check Select2 Api demo with Loading Remote Data heading at http://ivaynberg.github.io/select2/ http://ivaynberg.github.io/select2/上查看具有“加载远程数据”标题的Select2 Api演示。

just change normal <select> to <select multiple="multiple"> 只需将普通<select>更改为<select multiple="multiple">

请参阅此jquery UI组件,它可以满足您的目的。jquery自动完成远程

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM