Discussion :

[Rctiste]

Bonjour à tous,

Vous allez surement vous dire que c'est du vu et du re-vu mais mon problème ce n'est pas d'afficher ou de masquer les colonnes, j'utilise un simple :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

getElementById('id').style.display = "none"

dans une boucle for.

Le problème c'est que je dois masquer une colonne pour un tableau d'environ 2000 lignes (minimum) et le fait d'utiliser cette boucle me prend à peut près 30 secondes pour tout afficher.

Je me demandais si il n'y aurait pas une autre solution plus rapide?
J'ai fait le tour de beaucoup de solutions mais aucune ne ralenti vraiment le temps d'affichage.

Merci d'avance

[bigboomshakala]

salut

1ère optimisation : ne pas faire getElementById à chaque fois...

par exemple à la fin du chargement de ta page :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
var elts = [];
for (ma boucle){
  elts.push(document.getElementById('mon_id' + i));
}
 
/* 
tu remplis le tableau comme tu veux. si tu utilises jQuery c'est encore plus simple, elts = $('.toto') avec toto un css que tu mets sur les éléments à masquer/afficher, ou tu peux choisir un autre sélecteur
*/

par la suite tu boucles sur le tableaux des éléments, ce qui peut être 'achement plus rapide si le DOM de ta page est gros.

[Rctiste]

Merci beaucoup de cette réponse rapide,

Je ne vois pas trop comment utiliser ta var elts

[bigboomshakala]

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
function toggle(show){
  var i, n;
  for (i=0, n=elts.length; i<n; i++){
    elts[i].style.display = show ? null : "none"; 
   // ou "block" ou "inline" à la place de null
   // suivant ce que tu veux
  }
}

[Rctiste]

Oki, je comprend beaucoup mieux, je test ça dès que je peut et je vous tient au courant.

Merci beaucoup !

[Rctiste]

Voici un script vraiment performant (environ 1s a la place des 30 du départ) :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
 
var etat=1;
    var i;
    var affBlock= "block";
    var affNone= "none";
 
    function affichageCheckbox() {
 
        var lstIdCheckbox= document.getElementsByName("id_checkbox");
        var nombreLigne= checkbox.length;
 
        if (etat == 1) {
            for (i=0; i<(nombreLigne); i++) {
                lstIdCheckbox[i].style.display = affBlock;
            }
            etat=0;
        } else {
            for (i=0; i<(nombreLigne); i++) {
                lstIdCheckbox[i].style.display = affNone;
            }
            etat=1;
        }
    }

Voila j'espere que sa aidera du monde !!!