jQuery的自动完成JSON源 - 不会自动完成,而是只显示完整的列表 [英] jQuery autocomplete json source - Does not autocomplete, but just show the full list
问题描述
我使用jQuery UI的自动完成功能。
$(#搜索)。自动完成({
的minLength:0,
来源:source.php',
选择:函数(事件,UI){
$(#搜)VAL(ui.item.label)。
返回false;
},
重点:函数(事件,UI){
$(#搜)VAL(ui.item.label)。
返回false;
}
});
我插入了source.php多个元素和JSON返回它们连接codeD。
$搜索[] =数组(
'值'=> $ ID,
标签= GT; $名称
);
回声json_en code($搜索);
当我开始输入到自动完成字段列表显示与source.php的元素。但不幸的是与所有的人。他们取决于我在字段中输入不filtert。
时有什么特别的选项我有,当我使用JSON工作设置?
编辑:感谢T.J.克罗德我想出了这个解决方案,让jQuery的做的工作; )
$。的getJSON('source.php',函数(搜索){
$(#搜索)。自动完成({
的minLength:0,
来源:搜索,
选择:函数(事件,UI){
$(#搜)VAL(ui.item.label)。
返回false;
},
重点:函数(事件,UI){
$(#搜)VAL(ui.item.label)。
返回false;
}
});
这是从文档不是很明显,但是当你提供什么为源
,将涉及运行你的code(无论是服务器端或客户端),在jQuery UI的autocompleter预计的您的筛选结果。在服务器端code的情况下,你会使用词
参数把它传递给你的PHP文件。从的文档:
当使用字符串,则自动完成插件预计字符串以指向URL资源,将返回JSON数据。它可以是相同的主机上或在一个不同的(必须提供JSONP)。请求参数术语被添加到该URL。如上所述的本地数据中的数据本身可以是相同的格式。
块引用>(这将是很好的,如果他们真的提到的过滤;而我已记录的问题 。这表明他们的更新:他们花了不到三个小时来更新文档和关闭的问题;新文档会在某个时刻推,至少V1.9尼斯)<! / p>
该autocompleter允许您以三种方式提供源:
静态源阵列:在这种情况下,autocompleter不过滤
服务器端调用:在这种情况下,它通过一个
词
参数,并且你希望用它来过滤客户端调用:在这种情况下,它通过一个
要求
对象添加到您的客户端code,有一个词
财产;你希望用它来进行筛选。I use the autocomplete function of jQuery UI.
$("#search").autocomplete({ minLength: 0, source: 'source.php', select: function( event, ui ) { $("#search").val(ui.item.label); return false; }, focus: function(event, ui) { $("#search").val(ui.item.label); return false; }
});
I insert multiple elements in the source.php and return them json encoded.
$search[] = array( 'value' => $id, 'label' => $name ); echo json_encode($search);
When I start typing into the autocomplete field a list is shown with the elements of the source.php. But unfortunately with all of them. They are not filtert depending on what I enter in the field.
Is there any special option I have to set when I work with json?
EDIT: Thanks to T.J. Crowder I came up with this solution to let jQuery do the job ; )
$.getJSON('source.php', function(search) { $("#search").autocomplete({ minLength: 0, source: search, select: function( event, ui ) { $("#search").val(ui.item.label); return false; }, focus: function(event, ui) { $("#search").val(ui.item.label); return false; } });
解决方案It's not obvious from the docs, but when you supply anything as
source
that will involve running your code (either server- or client-side), the jQuery UI autocompleter expects you to filter the result. In the case of server-side code, you'd use theterm
parameter it passes to your PHP file. From the docs:When a String is used, the Autocomplete plugin expects that string to point to a URL resource that will return JSON data. It can be on the same host or on a different one (must provide JSONP). The request parameter "term" gets added to that URL. The data itself can be in the same format as the local data described above.
(It would be good if they actually mentioned filtering there; I've logged an issue suggesting that they do. Update: It took them less than three hours to update the docs and close the issue; new docs will be pushed at some point, at least by v1.9. Nice!)
The autocompleter allows you to supply sources in three ways:
Static source array: In this case, the autocompleter does the filtering.
Server-side call: In this case, it passes a
term
argument and you're expected to use it to filter.Client-side call: In this case, it passes a
request
object to your client-side code that has aterm
property; you're expected to use that to filter.这篇关于jQuery的自动完成JSON源 - 不会自动完成,而是只显示完整的列表的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!