jQuery non pubblicazione di tutti gli input di un form dopo l’ .append()

Ho un form generato dinamicamente con il metodo .append() di jQuery.
Posso aggiungere qualsiasi numero di nuovi input, textbox, cmbbox, ecc…

Ma il problema è che quando faccio l’compila il form, PHP target non ricevere il nuovo ingresso aggiunto, ma solo il vars collegato all’ingresso già in forma prima della append().

Tutte le idee?

Javascript:

$("#button").live('click',function add(){
   $("#list").append(
       '<li style="height:20px;">'
    +'<input type="text" class="text" id="prova" name="prova[]" value="prova">'+ 
       '</li>'
   );
});

Html:

<input type="submit" id="button" value="Add input">
<form name = "form" id="form" action="post.php" method="POST">
   <ul style="width:670px;padding:0px 0px 30px 0px" id="list">
   </ul>
   <input type="submit" id="submit" value="Submit">
</form>

PHP:

<?php
  print_r($_POST);
?>
  • Il codice di buon lavoro, C’era un problema di posizionamento del tag <form> di <div> doveva essere al di fuori
  • Questo commento è la chiave che mi ha portato al mio di riparazione. Ho avuto il mio <form> tag all’interno del <tbody> tag della tabella a cui ero .append() ing. Spostato il <form> tag sopra il tavolo e presentare ora include l’aggiunta di campi.
InformationsquelleAutor Claudio | 2010-10-02

 

5 Replies
  1. 4

    Problema 1:

    Tuo #button non dovrebbe essere di tipo submit, dal momento che si desidera utilizzare per aggiungere al form e non inviare il modulo. Così si dovrebbe avere:

    <input type="button" id="button" value="Add input">

    Problema 2:

    Si sono sovrascrivere le variabili. Il name è la variabile inviato con il modulo, in modo che ogni input inoltre deve avere un nuovo nome, o la variabile deve essere un array.

    Inoltre, non è possibile avere più di un elemento con la stessa id.

    Il modo più semplice per risolvere il problema è fare prova un array utilizzando il modulo di prova[]:

    $("#button").live('click',function() {
       $("#list").append(
           '<li style="height:20px;">' +
             //Removed repetitive ID and made prova an array
           '<input type="text" class="text" name="prova[]" value="prova"></li>'
       ); 
    });

    jsFiddle esempio

    • Stesso problema, come il DOM non vedere i nuovi elementi e l’invio non inviare tali variabili.
    • Funziona. Date un’occhiata a questo esempio: ==> jsfiddle.net/XAZD7 (clicca add input un paio di volte, poi submit – modificare i valori in input, se lo si desidera)
    • Funziona 🙂 grazie, c’era un problema di tag <form> nel codice html (non nel codice postato)
    • Sei il benvenuto 😉
  2. 1

    Si sono intercettare il click evento e l’aggiunta di elementi di forma, ma l’evento è già iniziato, e completa l’azione di default (inviare il modulo) senza ri-controllare il contenuto del modulo.

    Si dovrebbe interrompere l’evento dopo l’aggiunta di campi (preventDefault dovrebbero essere la scelta giusta), e poi ri-inviare il modulo.

    Qualcosa lungo queste linee:

    $('#button').live('click', function add(event){
        event.preventDefault();
        $('#list').append(...);
        $('#form').submit();
    });

    Non ho testato, ma sono abbastanza fiducioso che dovrebbe funzionare 🙂

    • Dove devo mettere il codice? e ‘ evento.preventDefault();?
    • Ho aggiunto il codice
    • Nulla, forse un codeigniter problema?
    • Invece di utilizzare preventDefault(), sarebbe molto più semplice per cambiare il type di #button per button invece di submit. Inoltre, questo non risolve il più identici name s…. vedi la mia risposta.
    • Inoltre, perché non si dispone di un $('#form').submit(); come l’ultima riga? Che ti invia il modulo del primo tempo #button è cliccato… facendo #button abbastanza inutile.
    • #pulsante è fuori forma, quindi non presenterà nulla.
    • Pietro e Molle hai ragione, ho totalmente frainteso la domanda. Le scuse.

  3. 1

    Giusto per chiarire e mettere qualsiasi altri problemi a parte, @Claudio nota è la risposta corretta qui. Ho appena avuto lo stesso problema, pulsante tipo “pulsante” e il nuovo nome dell’elemento è stato in modo dinamico incrementato. Tutto sembrava tranquillo, ma l’aggiunta di elementi non presentare.

    Poi ho notato che la mia forma di tag sono stati all’interno del tag di tabella. Mi sono trasferito fuori e tutto ha funzionato come previsto.

  4. 0

    Hanno alcun codice per mostrare? In ordine per php a “vedere” le variabili presentate, è necessario assicurarsi che ha l’attributo “name” specificato nel modulo elementi. Ho la sensazione che il problema sta per essere con jQuery non il php.

  5. 0

    Migliore ipotesi: non Hai impostato gli attributi di nome per il tuo aggiunti dinamicamente elementi.

    • OP codice imposta il name attributi, ma sono tutti identici.

Lascia un commento