Filtrage table dans iframe via JS, le scroll ne remonte pas => on croit que la table est vide
Bonjour à tous,
pour optimiser la recherche interactive dans une liste de plus de 3000 enregistrements, j'utilise un petit script js qui permet de filtrer une table html en rendant invisible les lignes ne contenant pas un mot clé de la recherche
de cette façon, je ne charge la page qu'une seule fois au début, c'est assez rapide (quelques secondes) et ensuite l'utilisateur peut chercher à l'intérieur de la table sans refaire de requête vers le serveur
Le code js est le suivant :
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
25
26
27
| function filtrerLISTING(){
var lignes = document.getElementById('table_listing').getElementsByTagName("tr");
for (var i=1; i < lignes.length; i++)
{
display = '';
var terms = keywords.toLowerCase().split(" ");
for (var j = 0; j < terms.length; j++) {
if (lignes[i].innerHTML.replace(/<[^>]+>/g, "").toLowerCase()
.indexOf(terms[j]) < 0) {
display = 'none';
}
}
lignes[i].style.display = display;
}
} |
Je dois préciser que la table listing se trouve dans une iframe, et que le form des critères de recherche se trouve dans la page parente. Le listing scroll donc dans la iframe. A noter que pour avoir un scroll parfaitement compatible avec les différents navigateurs, je passe par une bibliothèque iscroll.js (https://github.com/cubiq/iscroll)
Ca marche extrêmement bien, le seul problème c'est que le filtrage rend invisible les lignes non pertinentes vis à vis des critères mais ne remonte pas le tableau vers les premières lignes restées visibles.
Donc potentiellement, l'utilisateur se retrouve avec une iframe blanche, et croit qu'il n'y a aucun résultat. En fait il suffit de scroller vers le haut pour voir les lignes restées visibles car l'ascenceur est resté à sa place au moment du filtrage en milieu de table.
Ce que je voudrais c'est mettre en place une ruse pour que le listing remonte en tête de liste à chaque fois que le filtrage est exécuté...
J'aurai du mal à vous faire une démo en ligne, quoique, mais je pense que vous aurez compris ?
Merci à quiconque m'apportera une piste pour régler ce petit "bug".
