Discussion :

[lemmings]

Salut à tous,

je voudrais pouvoir éffacer des colonnes d'un grand tableau htlm.

j'ai deja ce code qui fonctionne mais il est d'une lenteur à faire peur.

si quelqu'un pouvais m'aider ca serait cool.

voici mon code :

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
 
//*************************************************************************************************
// fonction pour rendre visible un element choisi(d) ayant pour id(a) du tableau choisi(c)
// a = id de l'element a effacer
// c = id du tableau dans lequel on cherche
// d = nom du tag recherche ex: td,tr,...
//*************************************************************************************************
 
function see_col(a,c,d){
var tds=document.getElementById(c).getElementsByTagName(d);
var r= new RegExp("^"+a+".+");
for (var i=0; i<tds.length; i++) { 
  if(r.test(tds[i].id)){ 
   document.getElementById(tds[i].id).style.display="block"; 
 		} 
	} 
}

Merci d'avance pour l'aide que vous pourrez me fournir.

Lemmings

[javatwister]

hum; commençons peut-être par un display='none' ?

[lemmings]

je sais mais que ce soit block ou none le problème reste entier ;-)

[javatwister]

après, veux-tu "effacer" ou "rendre invisible"? c'est complètement différent;

je comprends mal le test et la regexp...

[javatwister]

pourquoi tu ne fais pas:

Code :

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

1
2
3
function see_col(a){
document.getElementById(a).style.display="block"; 
}

?

[lemmings]

le test avec la regexp est justifier dans le sense que je dois scanner tout le tableau a la recherche des éléments a éffacer. car je ne connais que le debut de l'id a éffacer .

pour exemple

je dois rendre invisible une colonne d'un tableau dont je sais que tous les id des td qui compose cette colonne commence par "kap" et le reste est généré pour rendre chaque td unique. donc j'ai des td avec comme id kap1568459.


voila en gros le problème

[javatwister]

eh bien... ton code semble parfait alors

[lemmings]

le probleme c'est qu'il met 5 minutes voir plus pour éffacer une colonne du tableau.

le document html qui contient le tableau fait 4 mb.


n'y aurait-il pas moyen d'ameliorer les performances de ce javascript ou est-ce que c'est lier a la puissance de la machine client.

[javatwister]

créer un attribut commun pour toutes les cellules d'une même colonne?

ça simplifie déjà;

[lemmings]

cad ? tu ferais ca comment ?

[lemmings]

en fait je viens de faire un petit script pour voir combien de td le script doit scanner et il y en a 29619 ....

donc je comprends pourquoi il est si lent

[javatwister]

en générant ton tableau, tu donnes un attribut "col" au td; la valeur de col doit correspondre au début de l'id, comme "kap", dans ton exemple;

Code :

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

mon_td.setAttribute("col","kap");

et après, ta fonction:

Code :

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

1
2
3
4
5
6
7
8
9
10
11
 
 
function see_col(a,c,d){ 
var tds=document.getElementById(c).getElementsByTagName(d); 
 
for(i=0; i!= tds.length; i++) {
	if(tds[i].getAttribute("col")==a){
		tds[i].style.display='none'
	}
}
}

[lemmings]

ca devrait allez plus vite a ton avis ?

[javatwister]

je n'en sais fichtrement rien

tu peux toujours essayer et concocter un ptit timer!

[lemmings]

je vais essayé et je te dis quoi.

[javatwister]

encore mieux à mon avis, un nom d'attribut unique par colonne, dont le nom et la valeur équivaut au début de l'id; ce qui donnera:

Code :

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

1
2
3
4
5
6
7
mon_td.setAttribute("kap","kap");
 
...
 
if(tds[i].getAttribute(a)){
     tds[i].style.display='none' 
}

[lemmings]

en fait je ne vois pas tres bien ou je dois mettre le mon_td.setAttribute :-)

mon tableau est généré a partir de plusieurs loop en coldfusion donc je vois pas tres bien ou je pourrais l'utiliser

[javatwister]

chaque cellule avec son id est bien générée dans une boucle?

eh bien au même moment, tu crées l'attribut en utilisant la même variable que pour l'id;

je ne connais rien à coldfusion mais peut-être peux-tu indiquer le bout de code où sont créées les cellules?

[lemmings]

voila quelque td

entre # c'est egale a une variable

Code :

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

1
2
3
4
5
6
7
 
<cfloop from ="1" to="125" index="a">
<td align="right" "kap#STADE##ATELIER#.#num0#.#num1#.#num2#.#num3##MATNR##tot#17">0</td>
<td align="right" "kap#STADE##ATELIER#.#num0#.#num1#.#num2#.#num3##MATNR##tot#18">0</td>
<td align="right" "kap#STADE##ATELIER#.#num0#.#num1#.#num2#.#num3##MATNR##tot#19">0</td>
<td align="right" "kap#STADE##ATELIER#.#num0#.#num1#.#num2#.#num3##MATNR##tot#20">0</td>
</cfloop>

[javatwister]

bah, je te confirme que je n'y comprends rien...

c'est un extrait du code qui crée des cellules avec leur id?