jQuery自动完成给出TypeError:this._renderItem(...)未定义 [英] jQuery autocomplete gives TypeError: this._renderItem(...) is undefined
问题描述
我当前在页面的三个位置使用.data( "ui-autocomplete" )._renderItem = function( ul, item )
.现在,我需要再添加一个.
I'm currently using .data( "ui-autocomplete" )._renderItem = function( ul, item )
in three places in my page. Now I need to add one more and I'm done.
但是这次我收到错误消息
But this time I get the error message
TypeError:this._renderItem(...)未定义
TypeError: this._renderItem(...) is undefined
奇怪的是,只有当我的IF
测试为假时,我才能得到这个.
The strange thing is that I only get this if my IF
test is false.
.data( "ui-autocomplete" )._renderItem = function( ul, item ) {
// If only one row is returned and ID = 0, then return 'no result' message
if(item.id == '0') {
return jQuery( "<li></li>" )
.data( "item.autocomplete", item )
.append( "<div class='no-result'>"+ item.value + "</div>" )
.appendTo( ul );
}
我不知道为什么它在这里失败了,而不是在其他3个地方都失败了.哪里有冲突?
I can't figure out why it's failing here, and not in the other 3 places. Is there a conflict somewhere?
这是我的代码
jQuery('#my-selector').autocomplete({
minLength: 2,
source: function( request, response ) {
jQuery.ajax({
url: callback_url,
dataType: "json",
data: {
term: request.term
},
success: function( data ) {
response( jQuery.map( data, function( item ) {
return {
id: item.id,
value: item.name,
name_encoded: item.name_encoded
}
}));
}
});
},
select: function( event, ui ) {
return false;
}
}).data( "ui-autocomplete" )._renderItem = function( ul, item ) {
if(item.id == '0') {
return jQuery( "<li></li>" )
.data( "item.autocomplete", item )
.append( "<div class='no-result'>"+ item.value + "</div>" )
.appendTo( ul );
}
};
更新
此更改有效.但是我仍然不明白为什么当我不在其他两个autocomplete
函数中使用它时为什么必须在这里使用else
语句.
This change works. But I still don't understand why I must use a else
statement here, when I'm not using it in two other autocomplete
functions.
.data( "ui-autocomplete" )._renderItemData = function( ul, item ) {
if(item.id == '0') {
return jQuery( "<li></li>" )
.data( "item.autocomplete", item )
.append( "<div class='no-result'>"+ item.value + "</div>" )
.appendTo( ul );
} else {
return this._renderItem( ul, item ).data( "ui-autocomplete-item", item );
}
};
从搜索条件为some
的查询中返回数据
Return data from query with search term some
[
{"id":"8186","name":"Some Are Thieves"},
{"id":"6149","name":"Somet"},
{"id":"6150","name":"Somethin'Else from SKECHERS"}
]
推荐答案
这是因为测试,如果测试失败,则_renderItem
不会返回与返回undefined
等效的任何值.
It is because of the test, if the test fails then _renderItem
does not return any value which is equivalent to returning undefined
.
但是按如下所示调用_renderItem
,这会导致错误,因为jquery尝试将数据值设置为返回值.
But _renderItem
is called as given below, which causes the error since jquery attempts to set the data value to the returned value.
return this._renderItem( ul, item ).data( "ui-autocomplete-item", item );
在您的情况下,您必须覆盖_renderItemData
而不是_renderItem
In your case you have to, override _renderItemData
instead of _renderItem
var el = $('<my-autocomplete-element>');
var _renderItemData = el.data("ui-autocomplete")._renderItemData;
el.data("ui-autocomplete")._renderItemData = function(ul, item) {
// If only one row is returned and ID = 0, then return 'no result' message
if (item.id == '0') {
return jQuery("<li></li>").data("item.autocomplete", item).data(
"ui-autocomplete-item", item).append("<div class='no-result'>"
+ item.value + "</div>").appendTo(ul);
} else {
_renderItemData.apply(this, arguments)
}
}
演示:柱塞
这篇关于jQuery自动完成给出TypeError:this._renderItem(...)未定义的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!