Salut à tous,

J'ai une fonction assez simple, qui fait 3 choses séquentiellement :
1. appeler un code serveur avec ajax(), qui renvoie un tableau HTML (<table>)
2. insérer le tableau HTML reçu dans un elément du document
3. appliquer une fonction au tableau (un plug-in jquery, tablesorter : http://tablesorter.com/docs/ , qui va rendre le tableau triable en cliquant sur les entêtes). Cette fonction va changer le tableau (insertion de styles et d'events).

Voici un pseudo code :

Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
 
$.ajax({
	   type: "GET",				   
	   url: myURL,
	   dataType: "html",				   
	   success: function(data){		 
		 $("#myDiv").html(data);
		 $("table").tablesorter();		 
	   }
	 });
Ca fonctionne bien, cependant quand le tableau est grand, la fonction tablesorter() est relativement lente.

Ce que je voudrais, c'est d'abord afficher le tableau immédiatement, sans tablesorter, puis appliquer tablesorter. Le but est de rendre l'appli plus agréable, tout simplement.

Le problème est que javascript ne va changer l'affichage qu'après que la fonction tablesorter soit appliquée. En mettant un alert('hello') entre
Code : Sélectionner tout - Visualiser dans une fenêtre à part
$("#myDiv").html(data);
et
Code : Sélectionner tout - Visualiser dans une fenêtre à part
$("table").tablesorter();
ça le fait bien en deux fois, mais bien sûr ce n'est pas intéressant comme solution. Est-ce que quelqu'un saurait comment faire ça en deux étapes de façon transparente pour l'utilisateur ?