jQuery自动完成JSON [英] jquery autocomplete json
问题描述
我正在尝试在表单上输入自动完成内容，但是在显示数据时遇到了问题.关于这一点有很多文章，但似乎还有许多不同的方法.我一直在尝试遵循jquery站点上的示例，但是我想我只是没有正确获得返回数据?我的页面看起来像:
I'm trying to have a autocomplete input on my form and I'm having problems getting the data to display. There are a ton of posts on this but also what seems like as many different ways of doing it. I've been trying to follow the examples on the jquery site but I guess I'm just not getting the return data correct? My page looks like:
<html>
<head>
<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/themes/base/jquery-ui.css" type="text/css" media="all" />
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$( "#Codes" ).autocomplete({
source: function( request, response ) {
$.ajax({
url: "/jreqlib",
dataType: "json",
data: {
featureClass: "P",
style: "full",
maxRows: 25,
},
success: function( data ) {
response( $.map( data, function( item ) {
return {
label: item.name,
value: item.name
}
}));
}
});
},
minLength: 1,
open: function() {
$( this ).removeClass( "ui-corner-all" ).addClass( "ui-corner-top" );
},
close: function() {
$( this ).removeClass( "ui-corner-top" ).addClass( "ui-corner-all" );
}
});
});
</script>
</head>
<body>
<form>
<input id="Codes">
</form>
</body>
</html>
我从服务器返回的内容如下:
What I'm returning from the server looks like this:
[{"1234":"1234"},{"134":"134},{"567":"567"}]
我想要的是，当我单击该框时，它会显示"1234"和"567"，如果我键入1，则将显示"1234"和"134"，如果我键入12，则只是"1234" "会出现.
What I would love is when I click in the box, it shows me "1234" and "567" and if I type 1 then "1234" and "134" would appear, if i type in 12 then just "1234" would appear ect.
任何帮助将不胜感激 TIA
Any help would be appreciated TIA
推荐答案
我的建议是让服务器根据搜索字符串动态生成json.在maxRows: 25,下插入name_startsWith: request.term.服务器现在可以在name_startsWith get-variable中找到搜索字符串.对于搜索字符串"1"，服务器可能会用["1234","134"]进行响应.
My suggestion is to let the server generate the json dynamically depending on the search string. Insertname_startsWith: request.term below maxRows: 25,. The server can now find the search string in the name_startsWith get-variable. For a search string '1' the server might respond with ["1234","134"].
此外，删除
featureClass: "P",
style: "full",
maxRows: 25,
然后替换
response( $.map( data, function( item ) {
return {
label: item.name,
value: item.name
}
}));
作者
response(data);
这篇关于jQuery自动完成JSON的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
