utilizzando jquery-ui completamento automatico con più campi di input

Question

buon pomeriggio a tutti!

ho risparmiato un sacco di tempo, ho letto tutti i post su StackOverflow ... e non sono in grado di eseguire il completamento automatico con campi di input multilpe. Ho provato ad attribuire una classe 'autoc' ad ogni input, uso un id differente per ogni campo (in effetti l'inedx dei campi di generazione del loop php). Non chiedo a qualcuno di fare il lavoro per me .... solo un esempio funzionante.

Grazie in anticipo.

PS: Mi scuso per il mio povero inglese ...

segue ora un pezzo di 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[]"> 

e 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

Senza conoscere l'esatto HTML e il array di oggetti passati a autocomplete origine, è difficile rendere esattamente il codice.

Tuttavia, avete chiesto di lavorare di autocomplete per più campi, ecco è solo un semplice esempio:

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

Se ci sono altre cose che si desidera includere nella risposta, sentitevi liberi di commentare.

EDIT

Il codice,

$('.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('');   
       } 
      }); 
     } 
    }); 
});