Bonjour à tous,
Je cherche à réaliser un formulaire dynamique dans lequel l'utilisateur peux renseigner autant d’adresse mail qu'il souhaite, pour cela j'ai besoin d'un formulaire qui soit extensible via JQuery ( j'ai pas trouvé mieux ). Donc j'ai commencé à développer tout ca dans un module quand je clique sur le bouton ajouter Email ca m'ajoute bien le champ mais quand je clique sur le bouton de suppression (petite icon poubelle du bootstrap de twitter) ben rien le JQuery rentre même pas dans la fonction...

Edit : Voici le code du module et l'archive contenant tout les fichier résolue pour ceux qui en ont besoin: JQueryInput.zip

Merci à exothermique et tout les autres de m'avoir aidé.

6 réponses


Tackacoder
Réponse acceptée

Bonjour,
Comme c'est un élément créé après le chargement de la page, ça ne fonctionne pas avec event "normaux"
Faut utiliser la fonction on

$('#supMail').on("click", function(){
    alert("yop");
        //$(this).parent(.remove();
        //i--;
              return false;
    });
Tackacoder
Réponse acceptée

Faites attention avec live, car c'est une fonction DEPRECATED, qui n'existe plus dans jquery 1.9
Il faut utiliser la fonction on()

Tackacoder
Réponse acceptée

J'ai corrigé ton script

<script>
jQuery(document).ready(function($) {
    var i =1;
    $('#addmail').click(function(){
        $('#mail').append('<div class="control-group" id="delete"><label class="control-label" for="inputIcon" >'+ i +']</label><div class="controls"><div class="input-prepend"><span class="add-on"><i class="icon-envelope"></i></span><input class="span2" type="text"></div> <a class="btn btn-danger suppr"><i class="icon-trash icon-white"></i></a></div> ');
        i++;
        return false;
    });
    $('#mail').on('click', '.suppr', function(){
        //alert("yop");
        $(this).parent().parent().remove();
        i--;
        return false;
    });
});
</script>

Bonjour,
je pense que c normal que ça marche pas, car ton button "#supMail" et un id pas une classe, essaye de changer id="supMail" par class="supMail" et $('#supMail').live("click",function() ... par $('.supMail').live("click",function() ...

Bonjour boumil, merci pour ta contribution par contre il semblerai que ca ne fonctionne pas... Pour ceux qui veulent Télécharger l'archive du module je vais la rajouter dans le premier post ;) cela sera plus simple pour voir ce qui marche ou non :)

Merci beaucoup exothermique ! Ça marche impec' :) Je passe en résolue et je met à jour l'archive pour ceux qui veule une base qui fonctionne :)