I have an autocomplete field and am just wondering how can i use it for multiple words? When i type the first word it works perfect, but when i space and type in the second word, its sends the two words back to the server and of course the results are wrong!
我有一个自动完成字段,我只是想知道如何将它用于多个单词?当我输入第一个单词时它完美无缺,但是当我在第二个单词中输入空格并输入时,它会将两个单词发送回服务器,当然结果是错误的!
eg. when i type the two words,
例如。当我输入两个单词时,
'Java javascript'
the first word 'Java', autocomplete works well, pull the list.
第一个单词'Java',自动完成效果很好,拉出列表。
but when i space and type javascript, autocomplete sends 'Java +javascript' to my ajax function.
但当我空格键入javascript时,自动完成功能会将'Java + javascript'发送到我的ajax函数。
Any ideas how to fix this?
任何想法如何解决这一问题?
4 个解决方案
#1
10
Looks like you can't, the built in implementation doesn't support it - you can see in the link above: "is not part of the stable release or distribution".
看起来你不能,内置的实现不支持它 - 你可以在上面的链接中看到:“不是稳定版本或发行版的一部分”。
However, I've downloaded and use the external version, available here:
但是,我已下载并使用外部版本,可在此处获得:
http://bassistance.de/jquery-plugins/jquery-plugin-autocomplete/
it's a little bigger, but the usage is exactly the same, you don't have to change anything, for multiple selection, add to the options {multiple:true}
它有点大,但用法完全相同,你不必改变任何东西,多选,添加到选项{multiple:true}
Update
JQueryUI has now been updated for the newest versions making this answer obsolete. An uptodate example can be found here
JQueryUI现在已经针对最新版本进行了更新,使得这个答案已经过时了。可以在此处找到最新的示例
#2
14
If you are using the "bassistance" version of Autocomplete, it's built in. But if you are using the jQuery UI version, there is an example here:
如果你使用的是“bassistance”版本的Autocomplete,它就是内置的。但是如果你使用的是jQuery UI版本,这里有一个例子:
#3
7
$("#tagnames").autocomplete("/tags/filter", {
max: 6,
highlightItem: true,
multiple: true,
multipleSeparator: " ",
})
To enable auto complete for multiple words you should set options multiple : true and multipleSeparator: " "
要为多个单词启用自动完成,您应该设置多个选项:true和multipleSeparator:“”
#4
0
Adding a comment for a more complete answer, let's say you have two possible selections with a common prefix:
添加注释以获得更完整的答案,假设您有两个可能的选项,使用公共前缀:
ip5, ip5 battery
ip5,ip5电池
if the user types in the textbox ip5, the first selection above will automatically get chosen without letting the user keep typing for the second selection, to avoid this behavior, make sure you use the option
如果用户输入文本框ip5,则上面的第一个选择将自动选择而不让用户继续输入第二个选项,以避免此行为,请确保使用该选项
triggerSelectOnValidInput: true,
#1
10
Looks like you can't, the built in implementation doesn't support it - you can see in the link above: "is not part of the stable release or distribution".
看起来你不能,内置的实现不支持它 - 你可以在上面的链接中看到:“不是稳定版本或发行版的一部分”。
However, I've downloaded and use the external version, available here:
但是,我已下载并使用外部版本,可在此处获得:
http://bassistance.de/jquery-plugins/jquery-plugin-autocomplete/
it's a little bigger, but the usage is exactly the same, you don't have to change anything, for multiple selection, add to the options {multiple:true}
它有点大,但用法完全相同,你不必改变任何东西,多选,添加到选项{multiple:true}
Update
JQueryUI has now been updated for the newest versions making this answer obsolete. An uptodate example can be found here
JQueryUI现在已经针对最新版本进行了更新,使得这个答案已经过时了。可以在此处找到最新的示例
#2
14
If you are using the "bassistance" version of Autocomplete, it's built in. But if you are using the jQuery UI version, there is an example here:
如果你使用的是“bassistance”版本的Autocomplete,它就是内置的。但是如果你使用的是jQuery UI版本,这里有一个例子:
#3
7
$("#tagnames").autocomplete("/tags/filter", {
max: 6,
highlightItem: true,
multiple: true,
multipleSeparator: " ",
})
To enable auto complete for multiple words you should set options multiple : true and multipleSeparator: " "
要为多个单词启用自动完成,您应该设置多个选项:true和multipleSeparator:“”
#4
0
Adding a comment for a more complete answer, let's say you have two possible selections with a common prefix:
添加注释以获得更完整的答案,假设您有两个可能的选项,使用公共前缀:
ip5, ip5 battery
ip5,ip5电池
if the user types in the textbox ip5, the first selection above will automatically get chosen without letting the user keep typing for the second selection, to avoid this behavior, make sure you use the option
如果用户输入文本框ip5,则上面的第一个选择将自动选择而不让用户继续输入第二个选项,以避免此行为,请确保使用该选项
triggerSelectOnValidInput: true,