Entendendo e implementando o autocomplete do jQuery com a fonte AJAX e appendTo
Abaixo está minha tentativa de obterappendTo
para trabalhar com o autocomplete do jQuery com o código AJAX.
Tenho várias perguntas, o que, esperamos, ajudará muitos outros que estão tendo dificuldades em entender a maneira correta de implementar o preenchimento automático com o código AJAX.
1)source: function(request, response) {...}
O que isso faz? Por que isso é necessário?
2) Qual formatofunction(data){ response($.map (data, function(obj) {
devolver os dados? Eu percebo que os dados estão no formato JSON, mas qual é o.map
? É necessário fazer isso? Existem benefícios?
3a) Ao usarappendTo
erenderItem
, é necessário ter o acima mencionadosuccess
dados retornados?
3b) Ou, dependendo dos dados acima, como você usa corretamente appendTo e renderItem para alterar a formatação e exibição de seus valores recuperados?
$(function() {
$( ".find_group_ac" ).autocomplete({
minLength: 1,
source: function(request, response) {
$.ajax({
url: "welcome/search/",
data: { term: $(".find_group_ac").val()},
dataType: "json",
type: "POST",
success: function(data){ response($.map
(data, function(obj) {
return {
label: obj.name + ': ' + obj.description,
value: obj.name,
id: obj.name
};}));}
});
}
}).data( "autocomplete" )._renderItem = function( ul, item ) {
return $( "<li></li>" )
.data( "item.autocomplete", item )
.append( "<a>" + item.label + "<br>" + item.desc + "</a>" )
.appendTo( ul );
};
});
Isso pode parecer muito para responder, mas tenho certeza que será valioso para muitos novatos em javascript e certamente para mim.