Riga di tabella dinamica e suggeritore

MarcoGrazia

Utente Attivo
15 Dic 2009
853
21
28
63
Udine
www.stilisticamente.com
Ciao, ho un problema con una tabella creata dinamicamente, in pratica dovendo inserire dei dati in una lista, creo una tabella con alcuni campi di input.
Fin qui nulla di speciale, uso jquery ma solo per semplicità, in realtà sto utilizzando codice standardizzato per rifare ciò che ho già implementato due anni fa e che tra l'altro funziona egregiamente.
Dato che il progetto è per una intranet, oltre a non potervi far vedere il codice in azione, questa sera potrò esprimere solo le mie domande, poi magari domani in ufficio metto su altro codice; non è un progetto segreto e non dovrò uccidervi tutti dopo... :D
Scherzi a parte ecco il problema: creata dinamicamente la prima riga sul secondo campo di input un "suggeritore" creato con jquery ui ( autocomplete ) mostra i nomi dei comuni italiani per la provincia di Udine, al terzo carattere inserito cerca nel database ( locale ) una serie di comuni che hanno quelle caratteristiche nel nome... ok avete capito.
Il problema comincia con la seconda riga, infatti quando si arriva all'ultimo campo ( sono 4 ) poi si preme un tasto e si genera una nuova riga e ricomincia il gioco, se non che il suggeritore non funziona più.
Il motivo è che la nuova riga contenente i campi generati automaticamente non è inserito nel flusso del programma, ma probabilmente ha una gestione separata e quindi, anche se non da errori di sorta, non fa funzionare il suggeritore.
Detto così è un po' semplicistico ma è ciò che succede, io avrei bisogno ovviamente che il suggeritore funzioni sempre, ma come faccio?
Un po' di codice? quello che ho recuperato:
la parte della tabella in cui si innestano le righe autogenerate.
HTML:
<form .... >
<tableclass="table">
<tbody></tbody>
<tfoot>
  <tr>
    <tdcolspan="4">
      <divclass="form-group">
        <divclass="col-md-12">
          <inputtype="button"class="btn btn-info btn-block"id="aggiungi"value="AGGIUNGI RIGA">
        </div>
      </div>
    </td>
  </tr>
</tfoot>
</table>
</form>
La parte in javascript ( semplificando un po' tutto )
Codice:
<script>
  $( document ).ready(function(){
    //  Gestione del suggeritore per i comuni.
    $("input[name^='comune']").autocomplete({
      source:'suggestionComuni.get.php',
      minChars:3,
      autoFill:true,
      max:30,
      formatItem:function( row ){
        return row[0]+" ("+ row[2]+", "+ row[1]+")"+" "+row[5];
      },
      formatMatch:function( row ){  return row[0];  },
      formatResult:function( row ){  return row[0];  }
    });

    var indice =1;
    function tableRowSet(){
      //  Creazione di una riga con le 4 celle.
     var cella1 ="<tr><td><div class=\"form-group\"><div class=\"col-md-12\"><input type=\"text\" id=\"numeroRett-"+ indice +"\" class=\"form-control\" name=\"numeroRett["+ indice +"]\" placeholder=\"000/00\" value=\"\"></div></div></td>",
     cella2 ="<td><div class=\"form-group\"><div class=\"col-md-12\"><input type=\"text\" id=\"comune-"+ indice +"\" class=\"form-control\" name=\"comune["+ indice +"]\" value=\"\"></div></div></td>",
     cella3 ="<td><div class=\"form-group\"><div class=\"col-md-12\"><input type=\"text\" id=\"persona-"+ indice +"\" class=\"form-control\" name=\"persona["+ indice +"]\" placeholder=\"Mario Rossi\" value=\"\"></div></div></td>",
     cella4 ="<td><div class=\"form-group\"><div class=\"col-md-12\"><select class=\"form-control\" id=\"statoCivile-"+ indice +"\" name=\"statoCivile["+ indice +"]\"><option value=\"nascita\">Nascita</option><option value=\"cittadinanza\">Cittadinanza</option><option value=\"matrimonio\">Matrimonio</option><option value=\"morte\">Morte</option></select></div></div></td></tr>",
      riga = cella1 + cella2 + cella3 + cella4;

      //  Aggiunge la riga
      $( riga ).appendTo('tbody');
      //  Focus sulla prima cella di ogni nuova riga.
      $('#numeroRett-'+ indice ).focus();
      indice++;  //  Aggiunge + 1 per la futura riga.
    };
    tableRowSet();    //    Inizializzazione alla prima riga.

    //  Richiede una nuova riga
    $('#aggiungi').on('click',function(){
      tableRowSet();
    });
                
  });
</script>
Ovviamente salto il codice del resto della pagina, anche perché dovendo usare un framework è molto ridondante, se volete provarlo, scaricate jquery, jquery ui e costruite pure una semplice pagina html usando questi pochi dati, per il database... fate voi.
Rimane il fatto che non so come ovviare al vero problema, cioè che il suggeritore non funziona sulla seconda riga generata.
Ho anche pensato di inserire l'intera funzione di autocomplete all'intera funzione dentro la tableRowSet() in modo da inserirla dentro la stessa routine che genera il codice dinamico, ma poi non funzionerebbe perché la chiamata al suggeritore è comunque esterna a quella funzione... o no? Domani ci provo tanto non mi costa nulla, ma se nel frattempo vi vengono delle idee, dei suggerimenti, ben vengano che ne ho tanto bisogno.
Ciauz.
 
prova a spostare "// Gestione del suggeritore per i comuni." nella "tableRowSet();"

in una una situazione simile, lo spostamento ha funzionato
(ultimo 3D di Matala se lo vuoi cercare)
 
prova a spostare "// Gestione del suggeritore per i comuni." nella "tableRowSet();"

in una una situazione simile, lo spostamento ha funzionato
(ultimo 3D di Matala se lo vuoi cercare)
Purtroppo non ha funzionato, ora non va nemmeno con la prima riga.
Io la soluzione ce l'ho sulla punta delle meningi ma non riesco a scoprirla, sono troppo coinvolto nella soluzione e non riesco a vederla.
 
Ultima modifica:

Discussioni simili