Problème de bouton

24 mars 2021, 22:03

Bonjour j'ai un problème je vous explique j'ai recrée une salle de classe avec les tables qui sont des "buttons" et qui sont aussi des images , j'ai donc crée un grid pour pouvoir bien les alignés mais voilà le problème j'aimerai que quand je clique dessus il y est un message sur la droit me disant le nom de la chaise ,
ps: je ne sais pas si button est la meilleure solution et pour le nom de la chaise je pense la mettre ne value.
Donc si vous pouviez m'aider pour faire ce que je veux faire ça serait vraiment génial merci

Code : Tout sélectionner

<?php
include("fonctions.php");
?>

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr">
    <head>
        
        <meta http-equiv="content-type" content="text/html; charset=utf-8" />
        <title>Réservation</title>

	<link href="CSS/Reserver.css" rel="stylesheet" media="all" type="text/css">
    </head>
    
	<header>
    
    <img class="logo" src="image/logo.png" ></img>
    
    <h2><a href="index.html">Cassin Seat</a></h2>
    <hr>
    <h1 class="titre2" >RESERVATION </h1><br>
    <div class="hr2">

    </div>
    <nav>
        <li><a href="index.html">Home</a></li>
        <li><a href="#">À Propos</a></li>
        <li><a href="#">Contacts</a></li>
  
    </nav>
  
</header>
    <body class="background-image" style="background-image: url(image/fond.png)">
    <nav>
    <img class="classe"  src="image/classe.png" align="center"></img>
    <img class="commande"  src="image/commande.png" align="right"></img>
    </nav>

    <form  method="POST">
    <a href="#" class="btn">COMMANDER</a>
    <div class="grid2">
    <button class="chaise"  name="chaise"  title="A1"></button>
    <button class="chaise" name="chaise"   title="A2"></button>
    <button class="chaise" name="chaise"  title="A3"></button>
    <button class="chaise" name="chaise"  title="A4"></button>
    <button class="chaise"name="chaise"  title="A5"></button>
    <button class="chaise"name="chaise"   title="A6"></button>
    <button class="chaise"name="chaise"   title="B1"></button>
    <button class="chaise"name="chaise"   title="B2"></button>
    <button class="chaise"name="chaise"   title="B3"></button>
    <button class="chaise"name="chaise"   title="B4"></button>
    <button class="chaise" name="chaise"  title="B5"></button>
    <button class="chaise" name="chaise"   title="B6"></button>
    <button  class="chaise" name="chaise"   title="C1"></button>
    <button  class="chaise" name="chaise"  title="C2"></button>
    <button class="chaise" name="chaise" title="C3"></button>
    <button  class="chaise" name="chaise"  title="C4"></button>
    <button  class="chaise"  name="chaise" title="C5"></button>
    <button  class="chaise" name="chaise"  title="C6"></button>
    <button  class="chaise" name="chaise" title="D1"></button>
    <button  class="chaise"name="chaise" title="D2"></button>
    <button  class="chaise" name="chaise" title="D3"></button>
    <button  class="chaise" name="chaise" title="D4"></button>
    <button  class="chaise"name="chaise"  title="D5"></button>
    <button  class="chaise"name="chaise" title="D6"></button>
    </div>
  </form>
	</body>

</html>

25 mars 2021, 00:21

En JavaScript c'est possible, ajoute un lecteur d’événement sur tes button avec addEventListener()

voir exemples

Ou directement via la méthode onclick:

document.getElementsByClassName("LesBoutons").onclick = function(e){
   console.log(e);// regarde ce que donne "e" et travail avec ce qu'il te faut
}
//button class="LesBoutons"...

Tu peux aussi mettre l'attribut onclick="maFonction(this)" dans l'élément button, puis dans ta fonction tu va chercher le value via this qui à été envoyé:

function maFonction(donnees){
   console.log(donnees.value);//la valeur de l'attribut value de ce bouton 
}

tu peux aussi récupérer la value via buttonName.value

Problème de bouton

Qui est en ligne