Bon,je suis entrain de travailler sur le systeme de commentaire dans mon site web et j'ai choisit de faire tout le systeme en ajax.Et pour ce systeme,j'ai choisit $.get .Le probleme auxquel je suis confronté c'est que je n'arrive pas a faire la selection du lien supprimer en jquery sur le commentaire poster en ajax sans recharger la page(ca ne marche pas).Si quelqu'un peut m'aider ca pourraît être sympa.Merci

PHP

<?php
$url = Router::url(array('controller'=>'myctrl',
                      'action'=>'add',
                      'admin'=> false
                      )); 
$delete = Router::url(array('controller'=>'myctrl','action'=>'delete',
'admin'=> false));
 ?>

JAVASCRIPT

$(function(){
    $('#post-form').click(function(e){
    e.preventDefault();
       $name = "<?php echo $this->Session->read('Auth.User.username') ?>";
       $mail = "<?php echo $this->Session->read('Auth.User.email') ?>";
       $content = $('#CommentContent').val();
       $parent_id=$('#parent_id').val();
       $id = $('#CommentPostId').val();
       $post = $('.postss');
       $.get("<?php echo $url ?>",{username:$name,post_id:$id,email:$mail
       ,content:$content,parent_id:$parent_id},function(data){
       $html ='<div class="comment"style="margin:10px 0;">
        <div class="media well">\
           <a class="pull-left" href="#">\
        <img src="http://1.gravatar.com/avatar/
        <?= md5('+data.Comment.email+'); ?>?s=100" width="70%" 
        class="img-circle"></a><a href="#" class="pull-right del" 
        data-id="<?php echo $v['id'] ?>" >Supprimer</a>
          </div></div></div>'
       $post.after($html);
     },'json');
       return false;
    });
      $('.del').click(function(e){
     e.preventDefault();
     console.log($(this).parent().parent());
     if(confirm('Voulez vous vraiment supprimer cette image?')){
     $.get("<?php echo $delete ?>/"+$(this).data('id')+"",function(data){
     },'json');
        $(this).parent().parent().slideUp();  
    }

  });

});

2 réponses


antho07
Réponse acceptée

Bonjour,

encore une fois (ce problème étant récurrent) :

  $('.del').click

A cet endroit jquery parcours le dom à la recherche de ces élements et ajoute des listeners sur l'évènement clicks aux élements trouvés.
Si tu rajoutes à posteriori des élements dans le dom, jquery ne relance pas le parcours du dom et aucun listener ne se trouve alors ajoutés sur tes éléments.

La solution :
Binder l'évenement sur un conteneur parent fixe

Pour ce faire:

 $(document).on('click','.del',function(event){
//Ta fonction
})

On peut remplacer document par n'importe quel élément parents à tes divs de class del présent avant l'appel ajax.

Cordialement

Antho

daemon24
Auteur

Merciiiiiiiiiiiiiiiii ca marche.Maintenant j'ai compris