11528 sujets

JavaScript, DOM et API Web HTML5

Comment mettre une condition avec addEventListener

bonsoir a tous

j'ai un bon commande qui traite le bon de commande avec un id="commander"
je souhaiterais que lorsque un client clic sur le bouton id="commander"
que l'id " total_qte" soit tester et que si la valeur de cet élément est égale à zéro j'affiche un message...

j'ai trouvé comment afficher un message lors du clic du bouton commander
mais je ne vois pas comment mettre la condition
<!DOCTYPE html>
<html>
<body>


<button id="commander">valider la commande </button>

<p id="demo"></p>

<script>
const element = document.getElementById("commander");
element.addEventListener("click", function() {
  document.getElementById("demo").innerHTML = "alors afficher message  ";
});
</script>

</body>
</html>


je souhaiterais donc faire ceci
if (id="total_qte"== 0) alors affiche un message

Merci de l'aide
Je ne vois pas trop comment un élément html (avec un id) pourrait avoir une valeur. Il nous en faut plus...
bonjour
merci pour la reponse

je devais surement dormir debout lorsque j'ai poster mon code

Je me reprends donc

j'ai un bon de commande das lequel un id total_qte est defini et qui englobe le total des articles dans le panier de mon bon de commande sa syntaxe est la suivante 

<span id="total_qte"></span>


je désire que lorsque l'utilisateur valide sa commande par cette syntaxe

<button type="button" class="btn btn-success" id="commander"><h3>Valider la commande</h3></button>


il puisse y avoir une condition sur le total_qte et que si cette valeur est egal a 0 qu 'un message d'erreur puisse apparaître lorsque je valide la commande

j'ai mis en place ce code
Mais aucun message n'apparait 

  <script>
  var btn = document.querySelector('#commander');


// addEventListener 
btn.addEventListener('click', function(){
 var total=document.getElementById('total_qte').innerHTML ;
 if ( total==' 0'){
          var p = document.createElement('p');
  p.innerText = 'Votre commande a déjà été envoyée';
  document.body.appendChild(p); }
 
});
  </script>
Je suis assez débutant en javascript, mais pour moi innerHTML va retourner une chaine de caractère de tout le contenu et non le nombre d'éléments.
Je ne pense pas non plus qu'il faille mettre des quotes autour d'une valeur numérique ('0').
Merci pour la réponse voici donc la solution 

	<script>
 var btn = document.querySelector('#commander');


// addEventListener 
btn.addEventListener('click', function(){
 var total=document.getElementById('total_qte').innerHTML ;
  console.log('TOTAL',total);
   if ( total== '0' || parseFloat(total)==0){ // tu avais un espace entre la quote et le zéro..
       //alert("Aucun article sélectionner ou votre commande a déjà été envoyée" );
          var p = document.createElement('p');
      p.innerText = 'Votre commande a déjà été envoyée';
      document.body.appendChild(p);
    } 
});
		</script>
Meilleure solution
Sujet clos
Aller à