我试图在他们的自定义示例中获得一个类似于:Here at jquery ui的自动补全。
这将使用ajax调用,而不是硬编码的数据。我希望显示两列(一个值和一个描述)。当用户输入时,.val()被传递到ajax页面,它提供建议。第一列将用于该值。
我能够使用一个简单的单列示例返回单个列,但不能返回多个值。我认为这很简单,因为它是示例代码的重新散列。非常感谢您的帮助。
<script>
$(document).ready(function() {
$('#myinputbox').autocomplete({
minLength: 4,
source: function(request, response){
var ajaxparam = $('#myinputbox').val();
ajaxparam = escape(ajaxparam);
var querystring = "?term=" + ajaxparam;
$.ajax({
url: 'ajax/jsonencode.php'+querystring,
beforeSend: function(){
alert("beforeSend");
},
async: true,
dataType: "json"
});
},
focus: function ( event,ui ){
$( "#myinputbox" ).val( ui.item.value );
return false;
},
select: function( event, ui ) {
$( "#myinputbox" ).val( ui.item.value );
return false;
}
})
.data( "autocomplete" )._renderItem = function( ul, item ) {
return $( "<li></li>" )
.data( "item.autocomplete", item )
.append( "<a>" + item.value + "<br>" + item.desc + "</a>" )
.appendTo( ul );
};
});
</script>beforeSend触发正常。如果我添加:
success: function(data){
alert(data);
}对于dataType,它会正确地提醒我对象对象。
json看起来像这样:
[
{
"value": "value1",
"desc": "Description 1"
},
{
"value": "value2",
"desc": "Description 2"
}
]
返回的json通过了jsonlint的验证。
_renderItem似乎不工作。
任何指针或解决方案都将不胜感激。
发布于 2011-11-29 03:26:52
在$.ajax调用中,您没有指定success回调:
$.ajax({
url: 'ajax/jsonencode.php'+querystring,
beforeSend: function(){
alert("beforeSend");
},
async: true,
dataType: "json"
});由于小部件希望您调用response函数来提供建议,因此您应该这样做:
$.ajax({
url: 'ajax/jsonencode.php'+querystring,
beforeSend: function(){
alert("beforeSend");
},
async: true,
dataType: "json",
success: response
});这假设您的数据至少有一个label或value属性。
https://stackoverflow.com/questions/8300908
复制相似问题