rafraichir js après ajax..

Leo Tiollier
Javascript

Bonjour. J'aimerais savoir comment faire pour faire fonctionner mes scripts sur de l'ajout de contenu en ajax. Exemple avec les fenetres modal : evenement onclick sur tous les bouton avec l'id "modal-trigger". Seulement je fais ensuite une requete ajax ce qui rajoute des boutons avec l'id "modal-trigger" mais ils ne sont pas reconnus et aucune fenetre modal s'ouvre..
En gros j'ai des articles, je click sur + d'articles, des articles sont ajoutés avec tous des boutons "supprimer" qui en cliquant dessus ouvre une fenetre modal.

3 réponses

guigui23
Réponse acceptée

Salut, J'ai eu ce problème avec jQuery.
Au lieu de faire un 

$('#monID').click( ...

Je fais un 

$(document).on('#monID','click',function(){});

La ça fonctionnera avec le contenu ajouté en ajax :)

maxslayer44
Réponse acceptée

Bonjour,

Je suppose que tu utilise jQuery, si ça n'est pas le cas, le principe reste le même :
Il faut créer une fonction qui s'applique à un élément DOM, et dans cette fonction, en mettre d'autres qui vont ajouter des écouteurs d'événements sur des éléments enfants.
Par exemple, pour le cas que tu as :

$.fn.btnAjax = function(){
    var $this = $(this);

    $this.find("#modal-trigger").click(function(e){
        // Ton code pour les bouttons
    });

    return $this; // Permet le chainage des méthodes
}
// Première éxécution
$(element).btnAjax();

// Et pour tes appels ajax (exemple)
$.ajax({
    url: url,
    type: type,
    data: data,
    success: function(datas, textStatus, jqXHR){
        // Tu fais tes manipulations sur le DOM
        ....
        // tu applique ta fonction aux nouveaux "containers" de bouttons
        $(containers).each(function(){
            $(this).btnAjax();
        });
    }
})

En espérant t'avoir aidé :)

Leo Tiollier
Auteur

Merci de votre aide :)