是否可以在不使用传统id,label,value的情况下使JQuery Autocomplete工作?
例如,我不想使用:
[ { "id": "Botaurus stellaris", "label": "Great Bittern", "value": "Great Bittern" },
{ "id": "Asio flammeus", "label": "Short-eared Owl", "value": "Short-eared Owl" }]
而是:
[ { "my_id": "Botaurus stellaris", "first_name": "Great Bittern", "last_name": "Great Bittern" },
{ "my_id": "Asio flammeus", "first_name": "Short-eared Owl", "last_name": "Short-eared Owl" }]
那么,JQuery autocomplete
通常需要id,value,label
,我可以将其my_id, first_name, last_name
并使Jquery Autocomplete与id,label,value
相同吗?
当我不希望修改来自数据源的数据键时,这可能很有用,可以在JQuery自动完成时显示它。
答案 0 :(得分:2)
没关系,
从JQueryUI的自动完成示例源中找到答案:
$( "#city" ).autocomplete({
source: function( request, response ) {
$.ajax({
url: "http://ws.geonames.org/searchJSON",
dataType: "jsonp",
data: {
featureClass: "P",
style: "full",
maxRows: 12,
name_startsWith: request.term
},
success: function( data ) {
response( $.map( data.geonames, function( item ) {
return {
label: item.name + (item.adminName1 ? ", " + item.adminName1 : "") + ", " + item.countryName,
value: item.name
}
}));
}
});
},
minLength: 2
});
这里,为source
分配了一个函数,它可以转换并返回任何类型的键,转换为JQuery的自动完成id,value,label
。
可能会有所帮助。
答案 1 :(得分:1)
有一个更好的解决方案。它甚至记录在jquery-ui网站上。
http://jqueryui.com/demos/autocomplete/#custom-data
$("input").autocomplete({..})
.data( "autocomplete" )._renderItem = function( ul, item ) {return $( "<li></li>" )
.data( "item.autocomplete", item )
.append( "<a>" + item.label + "<br>" + item.desc + "</a>" )
.appendTo( ul );
};