Пользовательский интерфейс JQuery autocomplete - нет результатов по нескольким полям
Эндрю ответ на мой комментарий вызвал этот вопрос.
Согласно его удивительному ответу в приведенной выше ссылке, код в нижней части вопроса будет работать только для ОДНОГО виджета. Но это убийца хороший код и имеет смысл... Я думаю, я хочу лучшее из обоих миров. Nice JS (если это возможно) и получить нулевые результаты show()
только тот элемент, который мы используем в то время.
Этот фрагмент кода является основным моментом моей проблемы, как я вижу:
source: function (request, response) {
jQuery.ajax({
url: "/autocomplete.json",
data: {
term: request.term
},
success: function (data) {
if (data.length == 0) {
jQuery('span.guest_investor_email').show();
jQuery('span.investor_field_delete_button').show();
}
response(data);
}
});
В настоящее время
У меня есть кнопка на моей странице с надписью "Добавить дополнительную информацию", и каждый раз, когда вы ее нажимаете, появляется новый экземпляр текстового поля автозаполнения, в котором содержатся скрытые поля и display:none;
на guest_investor_email
.
Если я использую текстовое поле автозаполнения, скажем 3 раза, и у меня есть 3 экземпляра автозаполнения на странице, а третий найдет 0 результатов: код покажет() все 3 экземпляра текстового поля guest_investor_email
вместо просто this
пустое.
ВОПРОС:
Как мне получить что-то вроде
jQuery(this).siblings(('span.guest_investor_email').show();
работать?
this
- это объект, а не массив элементов для выбора. Если это не с this
, я не возражаю, пока я знаю, как это сделать. Спасибо.
Полный код:
jQuery(".auto_search_complete").live("click", function() {
jQuery(this).autocomplete({
minLength: 3,
source: function (request, response) {
jQuery.ajax({
url: "/autocomplete.json",
data: {
term: request.term
},
success: function (data) {
if (data.length == 0) {
jQuery('span.guest_investor_email').show();
jQuery('span.investor_field_delete_button').show();
}
response(data);
}
});
},
focus: function(event, ui) {
jQuery(this).val(ui.item.user ? ui.item.user.name : ui.item.pitch.name);
return false;
},
select: function(event, ui) {
jQuery(this).val(ui.item.user ? ui.item.user.name : ui.item.pitch.name);
jQuery(this).siblings('div.hidden_fields').children('.poly_id').val(ui.item.user ? ui.item.user.id : ui.item.pitch.id);
jQuery(this).siblings('div.hidden_fields').children('.poly_type').val(ui.item.user ? "User" : "Pitch");
jQuery(this).siblings('span.guest_investor_email').hide();
jQuery(this).siblings('span.investor_field_delete_button').show();
jQuery(this).attr('readonly','readonly');
jQuery(this).attr('id', "investor-selected");
return false;
}
}).each(function() {
jQuery(this).data( "autocomplete" )._renderItem = function( ul, item ) {
return jQuery( "
" )
.data( "item.autocomplete", item )
.append("
" + (item.user ? item.user.name : item.pitch.name) + "
" + (item.user ? item.user.investor_type : item.pitch.investor_type) + " - " + (item.user ? item.user.city : item.pitch.city) + "
" )
.appendTo( ul );
};
});
});
Ответы
Ответ 1
Я не совсем понял, чего вы хотите достичь, но я думаю, вы хотите получить элемент, который вы привязываете к событию .live
правильно?
jQuery(".auto_search_complete").live("click", function() {
var $this = $(this);
jQuery(this).autocomplete({
minLength: 3,
...
success: function (data) {
if (data.length == 0) {
jQuery('span.guest_investor_email').show();
$this.siblings('span.investor_field_delete_button').show();
}
...