Jquery autocomplete UI - No results on multiple fields
Posted
by
pjammer
on Stack Overflow
See other posts from Stack Overflow
or by pjammer
Published on 2012-05-30T14:36:39Z
Indexed on
2012/05/30
16:40 UTC
Read the original article
Hit count: 266
Andrew's answer to my comment has sparked this question.
According to his awesome answer in the link above, the code at the bottom of the question will only work for ONE widget. But it's killer nice code and makes sense... I guess I want the best of both worlds. Nice JS, (if that is possible) and to have the zero results show()
just the element that we're using at the time.
This code snippet is the main crux of my problem, as I see it:
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); } });
Currently:
I have a button on my page that says "Add more Information" and each time you click it, a new instance of the autocomplete text field appears, complete with some hidden fields and a display:none;
on guest_investor_email
.
If I use the autocomplete text field, say 3 times, and i have 3 autocomplete instances on the page and the third one finds 0 results: The code will show() all 3 instances of the guest_investor_email
text field, instead of just this
one that is blank.
QUESTION:
How do i get something like
jQuery(this).siblings(('span.guest_investor_email').show();
to work?
this
is an Object and not an array of elements to select. If it isn't with this
I don't mind, as long as I know how to get at it. Thanks.
Full Code:
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) + "
© Stack Overflow or respective owner