DHTML : Hinding Table COLS :)

27 oct. 2005, 16:43

(Re)Bonjour à tous,

Et oui j'ai délaissé ma satané balise Option pour un autre défi... $\:D/$

Quelqu'un a-t-il déjà essayé de faire un tableau sur lequel on peut cacher les colonnes???
J'ai le début...c'est à dire j'ai caché les cells pour une colonne définie MAIS problème je veux redimensionner cette colonne vu qu'elle est censé ne plus rien contenir à l'affichage mais là je bloque.
J'ai bien trouvé ça: cliquez-ici (le code proposé) mais bon je suis moyen satisfait...car je veux juste "réduire" une colonne.

Une idée?

EDIT : Suppression du message pour mere-térésa

28 oct. 2005, 15:37

Mets le code que tu as déjà, car personnellement, je ne vais pas aller chercher le bout de code concerné dans l'autre page. Et donne une description avec plus claire stp

28 oct. 2005, 15:44

Cacher les colonnes me semble compliqué. Je ferais qqchose du genre : détacher l'élément DOM des cellules quand j'en ai aps besoin...

28 oct. 2005, 15:55

Modération : Sujet nettoyé

31 oct. 2005, 16:25

Bonjour,

Bon j'ai essayé en appliquant collapse sur les balises COL mais apparemment la valeur collapse de la propriété visibility n'est quasiment pas supportée (ou mal) par les browser actuels...
Alors j'ai essayé avec le bon vieux hidden mais j'ai un soucis sous FF, j'applique le style hidden à ma balise COL. Sous IE, les données assosiée à cette colonne ne sont plus visibles...sous FF elles le sont encore!

Pourriez-vous m'aider à comprendre pourquoi?

Voici le code:

Code : Tout sélectionner

<html>
  <head>
    <title>Test CSS</title>
	<script>
function affiche(baliseId) 
  {
  if (document.getElementById && document.getElementById(baliseId) != null) 
    {
    document.getElementById(baliseId).style.visibility='visible';
	/*document.getElementById(baliseId).style.display='block';*/
	document.getElementById(baliseId).width='200';
    }
  }
function cache(baliseId) 
{

  if (document.getElementById && document.getElementById(baliseId) != null) 
    {
    /*document.getElementById(baliseId).style.visibility='collapse';*/
	/*document.getElementById(baliseId).style.display='none';*/
	document.getElementById(baliseId).style.visibility='hidden';
	document.getElementById(baliseId).width='50';
	}
}
</script>
  </head>
  <body>
 <table border="1" width="600">
     <colgroup>
        <col id="col1" width="200">
        <col id="col2" width="200">
        <col id="col3" width="200">
     </colgroup>
	 <thead>
    <tr>
      <th><input type="button" title="Replier" onClick="cache('col1');" value="<<<"></input><input title="Afficher" type="button" onClick="affiche('col1');" value=">>>"></input></th>
      <th><input type="button" title="Replier" onClick="cache('col2');" value="<<<"></input><input title="Afficher" type="button" onClick="affiche('col2');" value=">>>"></input></th>
      <th><input type="button" title="Replier" onClick="cache('col3');" value="<<<"></input><input title="Afficher" type="button" onClick="affiche('col3');" value=">>>"></input></th>
    </tr>
    </thead>
    <tr>
      <td>1.1</td>
      <td>1.2</td>
      <td>1.3</td>
    </tr>
	<tr>
	  <td>2.1</td>
      <td>2.2</td>
      <td>2.3</td>
    </tr>
	<tr>
      <td>3.1</td>
      <td>3.2</td>
      <td>3.3</td>
    </tr>
</table>
</body>
</html>

DHTML : Hinding Table COLS :)

Qui est en ligne