11544 sujets

JavaScript, DOM et API Web HTML5

Bonjour,

Je me permets de poser cette question car j'ai un problème avec une fonction qui relève du php et du javascript

Voila mon problème :

J'ai adapté une fonction javascript que j'ai trouvé sur le net pour afficher cacher un div.

function showhide(){
  var i;
  var fiche = document.getElementsByClassName('fiche');
  var nbr = fiche.length;
  for (i=0;i<nbr;i++) {
    if(fiche[i].style.display =='block')
      { fiche[i].style.display = 'none'; 
      document.getElementById('btn').innerHTML='Détails';
      }
    else
      { fiche[i].style.display = 'block'; 
      document.getElementById('btn').innerHTML='Fermer';}   
  }
}


l'appel de la div :

<div class="stitre"><button onclick="showhide();" type= "button" id='btn'>Détails</button></div>


la div a cacher :

<div  class='fiche' style="display:none;">


Cette fonction marche parfaitement.

Mon problème est que la div en question provient d'un formulaire généré par une requête mysql. Elle se répète donc autant de fois qu'il y a de résultats et porte donc toujours la même class.
Et la forcement lorsque je clique sur le bouton "Détails" la fonction javascript ouvre toute les div de la page ayant pour <div class="fiche">.

Je pense qu'il doit falloir mettre un compteur sur la class mais malgré mais recherche,je ne trouve rien.

Pourriez -vous me donner quelques conseils? Merci beaucoup d'avance.

Astroma [/i][/i][/i]
Bonjour,

Dans le bouton détail, passe un identifiant dans ta fonction javascript, et utilise l'id dans ta div

<div class="stitre" id="unID"><button onclick="showhide('unID');" type= "button" id='btn'>Détails</button></div>


tu récupères cet id dans ta fonction javascript, et au lieu de sélectionner la div grâce à la classe, tu la sélectionnes grâce à l'ID

function showhide(unID){
  var i;
  var fiche = document.getElementsByClassId('unID');
...
}
Oui p'tite erreur de ma part, il ne faut pas mettre l'ID dans
<div class="stitre">
mais dans
<div  class='fiche' style="display:none;" id="unID">