Comment déclencher des gestionnaires d'événements après le chargement du contenu AJAX dans JQuery

Question

J'essaie d'utiliser une requête AJAX pour charger des informations dans une table à l'aide de JQuery. Je peux facilement charger le contenu, mais j'ai de la difficulté à ajouter des gestionnaires d'événements pour appliquer un style au contenu chargé.

J'applique un widget de striping à la table. Toutefois, lorsque ma requête AJAX revient et que mes informations sont ajoutées au corps de la table, le style n'est pas appliqué.

Le tutoriel JQuery mentionne l'utilisation de l'événement load pour gérer cela, mais je n'arrive pas à le faire fonctionner.

Toute aide serait appréciée.

 
$(document).ready(function(){ 
    $("#cowTable").tablesorter(); 
    addTableStriping(); 
}); 

function addTableStriping(){ 
    $("#cowTable").tablesorter({ 
     // striping looking 
     widgets: ['zebra'] 
    }); 
}; 

$(function(){ 
    $("#loadCowsButton").click(function(){ 
     $.post("loadCows.php", "scottm", function(xml) { 
      $("#cowTable tbody").append(xml); 
     }); 
    }); 
}); 

Answer 1

que j'ai trouvé une solution pour cela. Vous devez déclencher "applyWidgets" après la mise à jour. Merci pour toute l'aide de tout le monde, je n'aurais pas trouvé ça sans votre aide.

 
$(function(){ 
    $("#loadCowsButton").click(function(){ 
     $.post("loadCows.php", "scottm", function(xml) { 
      $("#cowTable").append(xml); 
      $("#cowTable").trigger("update"); 
      $("#cowTable").trigger("applyWidgets") 
     }); 
    }); 
}); 

Answer 2

Vous pourriez vouloir essayer le Livequery Plugin

Recherche en direct utilise la puissance des sélecteurs jQuery par des événements de liaison ou callbacks de tir pour les éléments correspondants auto-magie, même après que la page a été chargée et les DOM mis à jour .

Answer 3

C'est ce que vous devez faire:

Je l'ai trouvé sur le tablesorter website.

Le plus long et le plus court est que vous devez appeler $("#cowTable").trigger("update"); après avoir ajouté les données. Pourquoi ne pas simplement l'appeler dans le rappel AJAX?

Answer 4

$(function(){ 
    $("#loadCowsButton").click(function(){ 
     $.post("loadCows.php", "scottm", function(xml) { 
      $("#cowTable tbody").append(xml); 
      addTableStriping(); // <-- here 
     }); 
    }); 
}); 

Answer 5

cela devrait le faire ..

$(function(){ 
    $("#loadCowsButton").click(function(){ 
     $.post("loadCows.php", "scottm", function(xml) { 
      $("#cowTable tbody").append(xml); 
      $("#cowTable").trigger("update"); 
     }); 
    }); 
});