Bir sayfada * Otomatik Tamamlama'nın yalnızca bir * örneği nasıl eklenir?

Question

Bu yanıt - jQueryUI: how can I custom-format the Autocomplete plug-in results? - jqueryUI otomatik tamamlama widget'ının nasıl işleneceğini açıklar, böylece işleri belirli bir şekilde görüntüler. Kullandığı yaklaşım, $.ui.autocomplete.prototype'daki bir işlevi değiştirmektir.

Bu, tüm otomatik tamamlama araçlarının bu düzeltme ekini alacağı anlamına gelir.

için otomatik tamamlama küçük aracını yalnızca bir giriş elemanı için yamanın bir yolu var mı? Nedir?

$('$input').autocomplete'u incelediğimde, otomatik tamamlama hatalarını (_renderItem, _renderMenu, _search, vb.) Göremiyorum.

Answer 1

custom data and display demo'a bakın. http://jsfiddle.net/vJSwq/

Answer 2

Andrew Whitaker kod sadece için çalışmak:

İşte

$("selector").autocomplete({ ... }).data("autocomplete")._renderItem = function(ul, item) { 
    return $("<li></li>") 
     .data("item.autocomplete", item) 
     .append("<a>" + item.label + "<br>" + item.desc + "</a>") 
     .appendTo(ul); 
}; 

çalışan bir demo: Bu demo widget yalnızca bu örneği etkilenir, yani otomatik tamamlama widget prototip nesnesi değiştirme değil Bir otomatik tamamlama girişi. Birden fazla giriş elemanı seçerseniz, ikinci otomatik tamamlama widget'ı herhangi bir entrys göstermez. jQuery'ye son sürümlerinde için belirtilen here

$("selector") 
.autocomplete({ ... }) 
.each(function() { 
    $(this).data("autocomplete")._renderItem = function(ul, item) { 
     return $("<li></li>") 
      .data("item.autocomplete", item) 
      .append("<a>" + item.label + "<br>" + item.desc + "</a>") 
      .appendTo(ul); 
    }; 
); 

Answer 3

gibi tüm seçilen giriş elemanlarını handel bir foreach eklemek zorunda (1.8+)/jQuery UI (1.10+), kullanmak gerekir:

$("selector").autocomplete({ ... }).data('uiAutocomplete')._renderItem = function(ul, item) { 
    return $("<li></li>") 
     .data("item.autocomplete", item) 
     .append("<a>" + item.label + "<br>" + item.desc + "</a>") 
    .appendTo(ul); 
};