lundi 10 juin 2013

Utilisation de this dans un appel AJAX en jQuery

J'ai voulu déclencher une action en AJAX au clic sur un bouton, et je me suis rendu compte que le code exécuté dans "success" avec "this" ne fonctionnait pas :

$('a.comment-remove').live("click", function(e) {
    e.preventDefault();
    $.ajax({
        type: "POST",    

        url: "note_comment_remove.php",
        data: { comment_id: $(this).attr('data-id') },
        success: function(data) {
            $(this).parent().parent().remove();
        }
    });

});

C'est tout simplement parce que le "this" à cet endroit s'applique au contexte AJAX et non au contexte de la fonction appelée sur le onclick. Il faut donc setter le context :

$('a.comment-remove').live("click", function(e) {
    e.preventDefault();
    $.ajax({
        type: "POST",    

        url: "note_comment_remove.php",
        data: { comment_id: $(this).attr('data-id') },

        context: this,
        success: function(data) {
            $(this).parent().parent().remove();
        }
    });

});

Et ça marche !

Aucun commentaire:

Enregistrer un commentaire