Forum d'entraide PHPFrance

Bonjour,
j'ai un tableau qui affiche de nombreux enregistrements, je souhaiterai que en haut de la colonne grâce a un +/- cela affiche ou cache des colonnes.

voici le code que j'ai effectué :
au niveau du +/- :

<div align="center" id="ps" style="display:block"><input name="sub" type="image"  onClick="javacript:affcom()" src="../image/bouton/ps.gif"  border="0"></div><div align="center" id="ms" style="display:none"><input name="sub" type="image" onClick="javacript:cachecom()" src="../image/bouton/ms.gif" border="0"></div>

fonction :

<script language="JavaScript">
function affcom(){ 
  document.getElementById("com").style.display='block';  
  document.getElementById("ps").style.display='none';  
  document.getElementById("ms").style.display='block';  
} 
function cachecom(){ 
  document.getElementById("com").style.display='none';  
  document.getElementById("ps").style.display='block';  
  document.getElementById("ms").style.display='none';  
} 
</script>

au niveau de mon tableau :

<div align="center" id="com" style="display:none"><?php echo $data[13]; ?></div>

voila donc lorsque je clique sur mes boutons cela fonctionne sur ma première ligne mais pas les suivante. Je pensais faire un truc du genre com[x] mais je ne sais pas comment apres faire ensuite l'appel de fonction et gérer au niveau de la fonction.
auriez vous une idée pour mon problème ? merci

Salut,

attention un id doit etre unique dans une page !! donc ceci n'est pas la meilleur option !!

il est préférable d'opter pour des classes qui sont plus appropriées à ce genres d'opération !

En utilisant une lib tels que prototype, il te suffirais de noter :

function cache(arraysClass){
  $$('div.mask').invoke('removeClassName', 'mask'); /* supprime toutes les class mask existantes */
  for (j=0;j<arraysClass.length; j++){
    $$('div.'+arraysClass[j]).invoke('addClassName', 'mask');
  }
}

avec pour tes cellules : 
<div class="com" />
<div class="ps" />
<div class="ms" />
et en bouton :

<div align="center" id="ps" style="display:block">
<input name="sub" type="image"  onClick="javacript:cache(['ps'])" src="../image/bouton/ps.gif"  border="0">
</div>
<div align="center" id="ms" style="display:none">
<input name="sub" type="image" onClick="javacript:cache(['com','ms']);" src="../image/bouton/ms.gif" border="0">
</div>


en utilisant en css
.mask{display:none;}

Voila ... je ne suis pas certain du fonctionnement de invoke() je ne maitrise pas totalement, mais il me semble pas avoir fait d'erreur !!

Naturellement, tu dois impérativement déclarer le script prototype pour que cela fonctionne !!

@+