Discussion :

[Hallewest]

Bonjour,

J'ai un tableau qui a de nombreuses colonnes. Dans son état initial, je souhaiterais que certaines colonnes
soient cachées, et que lorsque je clique sur un bouton, toutes les colonnes s'affichent (le tout en javascript).

Sachant qu'il y a plusieurs cases à cacher, je ne peux pas leurs donner un id, je leurs donne donc un name commun.

sur le bouton qui sert a afficher toutes les cases, je met un onclick, qui appelle la fonction showall();

Code :

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

1
2
3
4
5
6
7
8
9
 function showall()
{
	var compt=document.getElementsByTagName("hidden").length;
	for(i=0;i<compt;i++)
	{
		document.getElementsByTagName("hidden")[i].style.display = 'inline';
	}
 
}

Cela ne fonctionne pas. J'ai du mal à voir d'ou vient le problème.
Je remercie les personnes qui trouverons le temps de m'aider.

[Bovino]

Code :

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

var compt=document.getElementsByTagName("hidden").length;

Il n'existe pas de tag HTML hidden
Peut-être devrais-tu faire :

Code :

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

var compt=document.getElementsByName("hidden").length;

[Hallewest]

J'ai changé, mais le problème est toujours la.

[Hallewest]

Au temps pour moi, le problème est résolu. Enfin...déplacé

En fait j'avais aussi changé le 'inline' par 'table-column|table-column-group', car lorsque je met inline (ou block) le tableau s'affiche de façon assez peu académique.

Mais il ne se passe rien lorsque je met display='table-column|table-column-group' avec javascript.

Je vais essayer avec toutes les propriétés possibles de display, j'espere qu'il y en aura au moins une qui marchera.

[Hallewest]

Ca marche sur Firefox avec :

Code :

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

	document.getElementsByName("hidden")[i].style.display = 'table-cell';

Mais malheuresement, rien ne se passe sous IE... Existe -t-il des solutions connues?

[Bovino]

Oui, si tu ne précises pas de valeur, c'est celle par défaut qui est appliquée :

Code :

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

document.getElementsByName("hidden")[i].style.display = '';

Attention toutefois, si un style a été défini dans une feuille de style, c'est celui-ci qui est considéré comme le style par défaut !

[Hallewest]

En mettant

Code :

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

document.getElementsByTagName("hidden")[i].style.display = '';

, les colonnes supplémentaires ne s'affichent pas lorsque j'apelle la fonction.

En mettant display=inline, l'affichage est inadapté, pareil pour block, inline-block...

J'aimerai éviter un rechargement de page (repasser au "tout php"), mais j'ai peur de ne pas avoir le choix.

[Bovino]

Oui, j'imagine que si ta classe s'appelle hidden, c'est qu'elle est masquée par défaut
Du coup, tu rentres dans ce cas de figure :

Attention toutefois, si un style a été défini dans une feuille de style, c'est celui-ci qui est considéré comme le style par défaut !

Il existe plusieurs solutions :

• Tu supprimes le display none du CSS et tu masques les éléments sur le onload de la page, inconvénient, tant que la page n'est pas chargée, tes éléments sont visibles
• Tu supprimes le display none du CSS et tu l'intègre inline dans l'attribut style des balises, inconvénient, c'est pas vraiment unobstrusive
• Tu affectes en CSS le display none via une autre classe, dans ton code, tu affectes 2 classes à tes éléments hidden, au chargement, tu attribues dynamiquement le display none à ta 1re classe puis tu supprimes la seconde.