Discussion :

[MasterChief78]

Bonjour tout le monde,
Alors je souhaiterais pouvoir afficher ou masquer toutes les lignes d'un tableau dont leur id commence par une certaine chaine.

Exemple : je reçois 1 comme paramètre, ça cache toutes les lignes dont l'id est "1......", ou 120134 et que ça cache toutes les lignes du style "123134...."

Alors mon tableau est basique, a part que les id ne se suivent pas en s'incrémentant un à un(c'est plutot du genre : 1, 102, 1123, 2, 45, 451, etc)
ma ligne type : <tr id="132" > <td>...</td> </tr>

Donc pour cela j'ai créer une petite fonction javascript, mais je sais pas comment atteindre les lignes du tableau, donc ça ne fonctionne pas :

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
24
25
 
function affCache(num) {
 
 
tab = document.getElementById('tableau_sommaire');
num = num + "";
var longueur = num.length;
 
 
var chaine = "";
 
for(i=0;i<tab.elements.length;i++)
{
 
	chaine = tab.elements[i].id.substr(0, longueur);
 
	if( chaine == num )
	{
		if(tab.elements[i].style.display == "") tab.elements[i].style.display = "none";
		else tab.elements[i].style.display = "";
	}
}
 
 
}

Merci d'avance pour votre aide à un débutant en JS

[lifty]

oula vaste programme

Le problème que tu as c'est que tu veut atteindre des lignes via leur identifiant sans connaitre ce dernier.

Je ne vois qu'une solution assez bourrine

Parcourir toutes tes lignes de ton tableau, vérifier leurs ids et cacher si leur id correspond.

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
function affCache(num) {
 
table = document.getElementById('tableau_sommaire');
var longueur = (num + "").length;
 
var chaine = "";
 
for (var i = 0; i < table.rows.length; i++) {
  row = table.rows[i];
 
  if (num == row.id.substr(0, longueur){
      row.style.display='none'
    }
  }
}

essaye avec ce code (j'ai pas testé, c'est fait un peu à l'arrache )

edit : à voir si c'est pas plus performant avec une bonne regexp

[RomainVALERI]

Je ne suis pas sûr qu'un id puisse commencer par un chiffre : à vérifier (dsl je n'ai pas le temps de rechercher tout de suite moi même )

[MasterChief78]

Pour l'id si si ça marche avec un chiffre, j'ai tester sur une seule ligne et ça marchait, maintenant j'essaie de faire pour plusieurs lignes.
@lifty, c'était ce genre de solution que je cherchais a faire, je go tester et je te dis

EDIT AFTER TEST : marche pas

[lifty]

Je ne suis pas sûr qu'un id puisse commencer par un chiffre : à vérifier (dsl je n'ai pas le temps de rechercher tout de suite moi même )

Sisi ça marche après pas sur que cela respecte la norme W3C

[Bovino]

Sisi ça marche après pas sur que cela respecte la norme W3C

Je dirais même : après, c'est certain, ça ne respecte pas les normes mais bon...
Pour revenir à ton souci, tu peux regarder du coté de cette contribution

[MasterChief78]

Donc ça ne fonctionne pas, déjà premier problème si je fais :

Code :

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

alert(table.rows.length);

il me donne 1 comme résultat, alors que j'ai bien sur beaucoup plus de lignes...

[MasterChief78]

Merci pour la source Bovino, j'ai modifié mon code comme suit pour utiliser la fonction, mais ça ne marche toujours pas, mon alert n'affiche rien...

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
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
document.getElementsByReg=function(tag,attr,reg,mod,val){
var tabReg=new Array();
var tabElts=document.body.getElementsByTagName(tag);
var TEL=tabElts.length;
 
if(!(reg instanceof RegExp)){
 
 
       if(reg.indexOf("*")>-1){
		  		reg=reg.replace(/\*/g,'.+');
 		  		reg=new RegExp(reg);
 		  		}
 		else {return	tabReg;
 			   }	
 		}
 
i=0;
while(tabElts[i]){
		if(tabElts[i][attr]){
	         if(reg.test(tabElts[i][attr])){
	         tabReg.push(tabElts[i]);}
	         }
	         reg.test("");
	i++;         
	}
return tabReg;
}
 
 
function affCache(num) {
 
num = "*"+num 	;
table = document.getElementsByReg('tr','id',num);
 
 
alert(table.rows.length);
 
 while(table[i])
 {
		if (table[i].style.display == "") table[i].style.display = "none";
		else table[i].style.display = "";
 
	i++;
 }
 
 
}

[MasterChief78]

Que ce soit par les regex, ou par la méthode bourin où l'on test tout, je suis preneur d'une solution, tant qu'elle marche