[AJAX] Rechargement d'une div et rechargement de javascript
Bonjour :)
Tout d'abord je vous expose mon problème :
J'ai une application (ASP.NET) qui me génère une page contenant un tableau. Ce tableau est partiellement mis en forme par du javascript (pagination, fonctions de tri). Les deux scripts javascript sont disponibles ici : tri de tableau, pagination.
Ces scripts fonctionnent parfaitement sur mon appli.
Par ailleurs, sur ma page, j'ai une liste déroulante qui comporte le nombre de résultats à afficher. Ainsi, je veux pouvoir modifier la pagination et le nombre de résultats à afficher dans mon tableau avec un rechargement uniquement du tableau. Pour cela, je récupère le nombre de résultats à afficher et je modifie les attributs de mon tableau (le nombre d'éléments à afficher est passé en argument dans la classe css du tableau).
Cela fonctionne également très bien après inspection du DOM.
Dernière étape : le rechargement du tableau avec la nouvelle valeur du nombre d'éléments de mon tableau.
Pour ça, j'utilise de l'Ajax :
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
| function envoieRequete(url, id) {
var xhr_object = null;
var position = id;
//window.alert(position);
if (window.XMLHttpRequest) xhr_object = new XMLHttpRequest();
else
if (window.ActiveXObject) xhr_object = new ActiveXObject("Microsoft.XMLHTTP");
xhr_object.open('POST', url, true);
xhr_object.onreadystatechange = function() {
if (xhr_object.readyState == 4) {
var position_debut_open = xhr_object.responseText.indexOf('<table class="tableDonnees ', 0);
var position_fin_open = xhr_object.responseText.indexOf('>', position_debut_open);
position_fin_open++;
var position_close = xhr_object.responseText.indexOf('</table>', position_fin_open);
var tableau = xhr_object.responseText.substring(position_fin_open, position_close);
document.getElementById(position).innerHTML = tableau;
}
}
xhr_object.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');
xhr_object.send(null);
} |
Comme vous le voyez, je récupère uniquement le contenu du tableau pour le réinsérer avec la directive innerHTML.
Le problème est le suivant :
Lorsque je change le nombre de lignes de mon tableau à afficher de telle sorte que toutes les lignes sont affichées, le fait de sélectionner un nombre plus petit d'éléments ne me modifie pas la pagination.
Par ailleurs, si par défaut j'affiche 1 élément et que je choisis d'en afficher 2, il m'affiche tous les éléments et non 2.
Faut-il indiquer au navigateur de réexécuter les javascripts après la réécriture de la page pour que la pagination s'applique correctement ?
Si oui, comment faut-il procéder ? Si non, comment puis-je résoudre ce problème ?
D'avance merci
