Visualizzazione dei risultati da 1 a 2 su 2
  1. #1
    Utente di HTML.it L'avatar di Marcolino's
    Registrato dal
    May 2003
    residenza
    Udine
    Messaggi
    3,606

    [jquery][jquery UI] Creazione dinamica celle di tabella e autocomplete

    Ciao, ho un problema
    Sto creando un'interfaccia per una intranet, tutto bene, ma mi è sorto un piccolo problema di secondaria importanza
    In realtà tutto funziona ma non l'autocomplete, perché da quello che ho capito il programma prende i dati da ciò che esiste al momento del caricamento della pagina e non tiene conto di ciò che viene creato dinamicamente dopo.
    Così se su un campo creato dinamicamente scrivo il nome di una città non mi viene fuori l'elenco.
    Purtroppo invece è ciò che devo fare, cioè far venire fuori i suggerimenti da ogni cella designata, anche quando è creata dinamicamente.
    Un po' di codice, tanto per esser chiari.
    HTML
    codice HTML:
    <form .... >
    <table class="table">
    <tbody></tbody>
    <tfoot>
      <tr>
        <td colspan="4">
          <div class="form-group">
            <div class="col-md-12">
              <input type="button" class="btn btn-info btn-block" id="aggiungi" value="AGGIUNGI RIGA">
            </div>
          </div>
        </td>
      </tr>
    </tfoot>
    </table>
    </form>
    e il javascript a valle
    codice:
    <script>
      $( document ).ready( function() {
        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();
        });
                    
        //  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];  }
        });
                    
      });
    </script>
    come si vede, la chiamata all'autocomplete l'ho messa sotto la richiesta di formare la prima riga della cella, e in questo modo su quella riga funziona, ma appena premo il tasto [AGGIUNGI RIGA] l'autocmplete sulla nuova riga non funziona più.
    Questo, immagino, perché non conosce il dato creato dinamicamente, ma come psso fare?

    PS non ho aggiunto tutto il codice della pagina perché molto prolisso, utilizza Bootstrap e se volete lo posto, non c'è nulla di segreto, solo che è un casino di codice per poco

  2. #2
    Utente di HTML.it L'avatar di Marcolino's
    Registrato dal
    May 2003
    residenza
    Udine
    Messaggi
    3,606
    Ho tentato di inserire la routine di autocompletamento all'interno della funzione tableRowSet() ma in come volevas dimostrare non funziona.

Permessi di invio

  • Non puoi inserire discussioni
  • Non puoi inserire repliche
  • Non puoi inserire allegati
  • Non puoi modificare i tuoi messaggi
  •  
Powered by vBulletin® Version 4.2.1
Copyright © 2025 vBulletin Solutions, Inc. All rights reserved.