11484 sujets

JavaScript, DOM et API Web HTML5

bjr, voila j'ai crée une boucle qui m'affiche des image de produit je souhaiterais cacher ou afficher l'ensemble des produit sur le clic d'un bouton pour pouvoir dans le future afficher les produit par prix croissant et décroissant mais le problème c'est que sa n'enlève que la première image je sais déjà que c'est a cause de l'id de la div qui se doit être unique mais je suis perdue je n'est plus d'idée si on pouvait m'aider merci .
mon php et html

 try
{
   
    $bdd = new PDO('mysql:host=localhost;dbname=projet;charset=utf8', 'root', '');
}
catch(Exception $e)
{   
        die('Erreur : '.$e->getMessage());
}
$normale = $bdd->query('SELECT type, url, prix, nom, pageproduit  FROM produits' );
$quantitetype = $bdd->query('SELECT  type ,count(type) AS"quantite"  FROM produits group by type' );
while ($donnees = $normale->fetch())
{
 ?>
 <div id="bloc">
    
   <a href="<?php echo $donnees['pageproduit'];?>"> <img  src='images/<?php echo $donnees['url'];?> '  /></a>
   
   <p id="nomproduit"><?php echo $donnees['nom'];?></p>
   <p id ="prixproduit"><?php echo $donnees['prix'];?> € </p>
   
 </div>
<?php  
}
$normale->closeCursor();

?>

et mon javascript qui supprime juste une image est un truc basique:

<button id="bouttonsuivant" onclick = "disparaitre()"  ><p>disparaitre</p></button>
</body>
<script type="text/javascript">
function disparaitre ()
 {
 document.getElementsById("bloc").style.display="none";
  }

</script>
Bonjour.

À ma connaissance 'getElementsById' n'existe pas. En revanche, 'getElementById' existe et ne peut retourner qu'un seul élément, celui qui est désigné par son id qui, comme vous l'avez dit, doit être unique.

Si vous voulez tout masquer, pourquoi ne pas mettre cette 'id' dans un 'div' à l'extérieur de la boucle de PHP (while...) ?
Salut,
au lieu de mettre un id (qui doit être unique..) nommé 'bloc' pour chaque produits, il faudrait plutôt mettre une classe.
Tu pourra ensuite utiliser la fonction document.getElementsByClassName()

Bon courage
j'ai justement finie par trouver par moi même dans touts les cas merci et le code que j'ai trouver et qui ressoude mon problème:
 function disparaitre()
{
var a = document.getElementsByClassName("blocbiere");
for (i=0; i<a.length; i++){
  a[i].style.display='none';
}
 
} 

voila getElementsByClassName retourne un tableau voila pourquoi on ne peut
pas juste remplacer getElementsById par getElementsByClassName.