jQuery ne pas poster toutes les entrées d'un formulaire après l' .append()

J'ai un formulaire généré dynamiquement avec la méthode .append() de jQuery.
Je peux ajouter n'importe quel nombre de nouvelle entrée, une zone de texte, cmbbox, etc...

Mais le problème est que lorsque je ne la faites de la forme, le PHP cible ne reçoit pas la nouvelle entrée ajoutée, mais juste le vars connecté à l'entrée déjà dans le formulaire avant de l'ajouter().

Des idées?

Le javascript:

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

Le Code 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>

Le PHP:

<?php
  print_r($_POST);
?>
Le code du bon travail, Il y a un problème de positionnement de la balise <form> qui a été dans un <div>, et devait être à l'extérieur
Ce commentaire est la clé qui m'a conduit à ma réparation. J'ai eu mon <form> balise à l'intérieur de la <tbody> tag de la table à laquelle j'étais .append() ing. Déplacé le <form> tag au-dessus de la table et de soumettre comprend maintenant la annexé champs.

OriginalL'auteur Claudio | 2010-10-02

  1. 3

    Problème 1:

    Votre #button ne doit pas être de type submit, puisque vous voulez juste de l'utiliser pour ajouter de la forme et de ne pas soumettre le formulaire. Donc, vous devriez avoir:

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

    Problème 2:

    Vous écrasez vos variables. Le name est la variable envoyée avec le formulaire, de sorte que chaque input plus doit avoir un nouveau nom, ou la variable doit être un tableau.

    En outre, vous ne pouvez pas avoir plus d'un élément avec la même id.

    La façon la plus simple de résoudre ce problème est de faire prova un tableau en utilisant le formulaire de 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 exemple

    Même problème, c'est comme le DOM ne pas voir les nouveaux articles et les soumettre envoie pas ces variables.
    Elle fonctionne. Jetez un oeil à cet exemple ==> jsfiddle.net/XAZD7 (cliquez sur add input à quelques reprises, puis submit - modifier les valeurs dans les entrées si vous le souhaitez)
    Il fonctionne 🙂 merci à vous, il y a un problème dans la balise <form> dans le code html (pas dans la posté code)
    Vous êtes les bienvenus 😉

    OriginalL'auteur Peter Ajtai

  2. 1

    Vous êtes l'interception de la click événement et d'ajouter des éléments à la forme, mais l'événement a déjà commencé, et complète son action par défaut (soumettre le formulaire) sans re-vérifier le contenu de la forme.

    Vous devriez cesser de l'événement, après l'ajout des champs (preventDefault devrait être le bon choix), puis re-soumettre le formulaire.

    Quelque chose le long de ces lignes:

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

    Je ne l'ai pas testé, mais je suis assez confiant sur le fait que cela devrait fonctionner 🙂

    Où je dois mettre le code? c'est l'événement.preventDefault();?
    J'ai ajouté le code
    Rien, peut-être codeigniter problème?
    Au lieu d'utiliser preventDefault(), ce serait beaucoup plus simple de changer la type de #button à button au lieu de submit. Aussi, ce n'est pas de résoudre les multiples identiques name s.... voir ma réponse.
    Aussi, pourquoi avez-vous un $('#form').submit(); que la dernière ligne? Que vais soumettre le formulaire la première fois #button est cliqué... faire #button assez inutile.

    OriginalL'auteur MartinodF

  3. 1

    Juste pour clarifier, et de mettre tous les autres problèmes de côté, @Claudio remarque est la bonne réponse ici. J'ai juste eu le même problème, le bouton de type "bouton" et le nouveau nom de l'élément a été dynamiquement incrémenté. Tout avait l'air bien, mais les éléments ajoutés ne serait pas soumettre.

    Puis j'ai remarqué que mes balises de formulaire ont été à l'intérieur de la table de balises. J'ai déménagé à l'extérieur et tout a fonctionné comme prévu.

    OriginalL'auteur Dazbert

  4. 0

    Avoir tout le code pour afficher? Afin de php pour "voir" les vars soumis, vous devez vous assurer qu'il a le "nom" de l'attribut spécifié sur le formulaire d'éléments. J'ai le sentiment que votre problème va être avec jQuery pas le php.

    OriginalL'auteur jsuggs

  5. 0

    Meilleure supposition: Vous n'avez pas défini les attributs de nom pour votre dynamiquement des éléments ajoutés.

    OP du code définit la name attributs, mais ils sont tous identiques.

    OriginalL'auteur Thomas