przy użyciu autouzupełniania jquery-ui z wieloma polami wejściowymi

Question

dzień dobry wszystko!

Oszczędziłem dużo czasu, czytałem wszystkie posty na stackoverflow ... i nie jestem w stanie zrobić autouzupełniania pracując z polami wejściowymi multilpe. Próbowałem przypisać klasy "autoc" do każdego wejścia, używam innego identyfikatora dla każdego pola (w rzeczywistości inedx pól generujących pętlę php). Nie proszę kogoś, aby wykonał pracę dla mnie ... tylko przykład pracy.

Z góry dziękuję.

PS: Przepraszam za mój słaby angielski ...

teraz następujący kawałek HTML:

<input id="search_ctO" class="autoc" type="text" name="search_ct[]"> 
    <input id="search_ct1" class="autoc" type="text" name="search_ct[]"> 
    <input id="search_ct2" class="autoc" type="text" name="search_ct[]"> 
    .... 
    <input id="search_ctn" class="autoc" type="text" name="search_ct[]"> 

i jQuery:

$('.autoc').on("focus", function() 
     $(this).autocomplete({ 
     minLength: 2, 
     source: 'liste_contact.php', 
     select: function(event, ui) { 
     $('.autoC#search_ct').val(ui.item.label); //id="search_ct'.$i.' 
     $(".autoC#contact_id").val(ui.item.value); // 
     $("autoC#contact_description").val(ui.item.desc); 
     return false; 
     }, 
     change: function(){ 
     var servi = $("#service_id").val(); 
     var hop = $('#hop').val(); 
     var contact = $("#contact_id").val(); 
     $.ajax({ 
      url: 'ajout_contact.php', 
      data: "serv="+ servi+"&hopit=" + hop+"&contact="+ contact+"",// on envoie la requete d'ajout de contact 

     success: function() { 
       $("#search_ct").val(''); 
       // location.reload(true);   
     } 

Answer 1

nie znając dokładnej HTML i tym tablica obiektów przekazana do źródła autocomplete, trudno jest dokładnie wpisać kod.

Jednak prosić o pracę z autocomplete wielu dziedzinach, tak tutaj jest to tylko prosty przykład:

HTML

<input id="search_ctO" class="autoc" type="text" name="search_ct[]"/> 
<input id="search_ct1" class="autoc" type="text" name="search_ct[]"/> 
<input id="search_ct2" class="autoc" type="text" name="search_ct[]"/> 
<input id="search_ctn" class="autoc" type="text" name="search_ct[]"/> 

JS

var tags = ["abc","def","xyz"]; 
$('.autoc').on("focus", function(){ 
     $(this).autocomplete({ 
     minLength: 2, 
     source: tags 
     }); 
}); 

JSFIDDLE DEMO

Jeśli istnieje jakakolwiek inna rzecz, którą chcesz uwzględnić w odpowiedzi, prosimy o komentarz.

EDIT

Twój kod,

$('.autoc').on("focus", function() { 
    $(this).autocomplete({ 
     minLength: 2, 
     source: 'liste_contact.php', 
     select: function(event, ui) { 
      $('.autoC#search_ct').val(ui.item.label); 
      $(".autoC#contact_id").val(ui.item.value); 
      $("autoC#contact_description").val(ui.item.desc); 
      return false; 
     }, 
     change: function() { 
      var servi = $("#service_id").val(); 
      var hop = $('#hop').val(); 
      var contact = $("#contact_id").val(); 
      $.ajax({ 
       url: 'ajout_contact.php', 
       data: "serv="+servi+"&hopit="+hop+"&contact="+contact+"", 
       success: function() { 
        $("#search_ct").val('');   
       } 
      }); 
     } 
    }); 
});