Codage juste ?

sarah21091999 -

Bonjour, j'aimerai savoir si mon codage est juste ...
Je voudrais que lorsque je donne le code voyage dans mon formulaire s'affiche dans la case "prix" le prix correspondant

mon code :

<!DOCTYPE html>
<html>
 <head>
  <meta charset="utf-8" />
  <title>FORMULAIRE</title>
  <style>
   h1{text-align:center;}
  </style>
 </head>
   <body text="#29088A">
     <form method="post" action="inscriptionvalidee.php">
      <div style="text-align:center">
        <p>
          <img src="nevers.png" alt="photo nevers" width="500" height="650" hspace="16" align="left"> 
        </p>
		<font size="6">
        <U><h1>FORMULAIRE</h1></U>
		</font>
		<font size="5">
		<p align="center">
              <label>Code Agent</label> : 
              <input type="text" name="agent" onkeyup="calcul(this)" id="code" value="" /> 
		</p>
        <p align="center">
            <label>Nom Client</label> : 
            <input type="text"  name="nom" value="" require/>
            <p align="center">
              <label>Prénom Client</label> : 
              <input type="text" name="prenom" value="" /> 
            </p>
            <p align="center">
              <label>Age Client</label> : 
              <input type=radio name="age12" id='agem12' onclick="verifAge(this.value);" value='-12'> -12 ans 
              <input type=radio name="age12" id='agep12' onclick="verifAge(this.value);" value='+12'> +12 ans 
            </p>
          </font>
        </p>
		<font size="5">
		<p align="center">
              <label>Code Voyage</label> : 
              <input type="text" name="voy" onkeyup="prix(this);" id="voyage" value="" /> 
		</p>
        <br>
        <span style="text-align:center" id="zone_prix" >
		<font size ="5">
          <label>Prix</label> : 
          <input type="text" name="prix" onkeyup="verifPrix(this);" id="prix" value='' > € <span style='background-color:#ffff66;' id='reduc' style='display:none' >-50%</span>
		  </br>
		  <br>
          <label>Prix Final </label> 
          <input type="text" name="prixfinal" readonly id="prixfinal" value='' /> €
        </span>
		</font>
		</br>
        
       </form>
        <p align="center">
		<br>
          <input type="submit" value="Inscription" style="height:35px; background-color:#29088A; color:white"  ></a>
        </p>
		<font size="5">
		<p align="center">
              <label>Valeur Commission</label> : 
              <input type="text" name="commission" id="vcommission" value="" /> 
		</p>
		</font>
      </div>
    <script type="text/javascript">
      /**
      // Affiche la zone réduc en fonction de l'age selectionné
      */
      function verifAge(age){
        var reduc = document.getElementById('reduc');
        var prix = document.getElementById('prix');
        reduc.style.display =  age == '-12' ? 'inline' : 'none';   
        verifPrix(prix);
      }
      
      /*
      // Fait le calcul du prix en fonction de l'age coché
      */
      function verifPrix(elm){
        var prix = elm;
        var prixval = elm.value;
        var agem12 = document.getElementById('agem12');
        var agep12 = document.getElementById('agep12');
        var prixfinal = document.getElementById('prixfinal');
        var age = agem12.checked ? '-12' : (agep12.checked ? '+12' : '');
        if(age == '-12'){
           console.log('ancien prix : ' + prixval);
           var prixreduc = parseFloat(prixval) * 0.5;
           console.log('Nouveau prix : ' + prixreduc);
           prixfinal.value = prixreduc;
		   
        }else if(age == '+12'){
           prixfinal.value = prixval;
        }else{
           //si aucune case n'est cochée...
           prixfinal.value = prixval;
		   
        }
      }
	  function calcul(){
  var code = document.getElementById('code');
  var prixfinal = document.getElementById('prixfinal');
  var vcommission = document.getElementById('vcommission');

  var codeval = code.value;
  switch(codeval){
    case "JT": // si JT
      vcommission.value = prixfinal.value * 0.10;
      break;
    case "LB":  //si LB
      vcommission.value = prixfinal.value * 0.08;
	  break;
    case "MM":  //si MM
      vcommission.value = prixfinal.value * 0.08;
	  break;
    case "RA":  //si RA
      vcommission.value = prixfinal.value * 0.10;
      break;
    default: // Si aucun des deux
      vcommission.value = 0;
      break;
  }
}

function prix(){
  var voyage = document.getElementById('voyage');
  var prix = document.getElementById('prix');
  

  var voyageval = voyage.value;
  switch(voyageval){
    case "AFR01": 
      prix.value = 2340;
      break;
    case "ECO01":  
      prix.value = 550;
	  break;
    
    default: // Si aucun des deux
      prix.value = 0;
      break;
  }
}
    </script>
  </body> 
</html>

Afficher la suite

2 réponses

Résumé de la discussion

La discussion porte sur la vérification d'un formulaire HTML/JavaScript où le code voyage détermine le prix affiché et le calcul des montants, avec une gestion des réductions et de la commission. Plusieurs réponses préconisent d'établir une valeur par défaut pour l'âge afin que la réduction s'applique correctement et de remplacer verifPrix par une fonction nommée calculPrix. D'autres échanges notent que le calcul du prix était présent, mais que des incohérences telles que « code voyage » et copier-coller mal alignés peuvent brouiller la logique et nécessiter un réajustement. D'autres indices techniques apparaissent, incluant l'état des boutons radio, l'affichage conditionnel et les zones prix et prix final, tout en évoquant brièvement des détails tels qu'une référence à une ligne de code.

Réponse 1 / 2
jordane45 Modérateur
Ca me semble correct.
De toutes façons... si tu le testes... ça te donne quoi ?

Et si jamais ça ne fonctionne pas.... qu'as tu dans la console de ton navigateur ?
0
1. sarah21091999 Auteur
  
  ca ne fonctionne pas (je parle bien du dernier).
  
  qu'est ce que la console ?
  
  0
2. jordane45 Modérateur
  
  A connaitre absolument pour débuguer ses codes JS
  https://www.alsacreations.com/astuce/lire/1436-console-javascript.html
  
  0

jordane45 Modérateur

Perso, j'aurais traité ça plus ou moins comme ça

<!DOCTYPE html>
<html>
 <head>
  <meta charset="utf-8" />
  <title>FORMULAIRE</title>
  <style>
   h1{text-align:center;}
  </style>
 </head>
   <body text="#29088A">
     <form method="post" action="inscriptionvalidee.php">
      <div style="text-align:center">
        <p>
          <img src="nevers.png" alt="photo nevers" width="500" height="650" hspace="16" align="left"> 
        </p>
		<font size="6">
        <U><h1>FORMULAIRE</h1></U>
		</font>
		<font size="5">
		<p align="center">
              <label>Code Agent</label> : 
              <input type="text" name="agent" onkeyup="calculPrix()" id="code" value="" /> 
		</p>
        <p align="center">
            <label>Nom Client</label> : 
            <input type="text"  name="nom" value="" require/>
            <p align="center">
              <label>Prénom Client</label> : 
              <input type="text" name="prenom" value="" /> 
            </p>
            <p align="center">
              <label>Age Client</label> : 
              <input type=radio name="age12" id='agem12' onclick="verifAge(this.value);" value='-12'> -12 ans 
              <input type=radio name="age12" id='agep12' onclick="verifAge(this.value);" value='+12'> +12 ans 
            </p>
          </font>
        </p>
		<font size="5">
		<p align="center">
              <label>Code Voyage</label> : 
              <input type="text" name="voy" onkeyup="calculPrix();" id="voyage" value="" /> 
		</p>
        <br>
        <span style="text-align:center" id="zone_prix" >
		<font size ="5">
          <label>Prix</label> : 
          <input type="text" name="prix" onkeyup="verifPrix(this);" id="prix" value='' >  <span style='background-color:#ffff66;' id='reduc' style='display:none' >-50%</span>
		  </br>
		  <br>
          <label>Prix Final </label> 
          <input type="text" name="prixfinal" readonly id="prixfinal" value='' /> 
        </span>
		</font>
		</br>
        
       </form>
        <p align="center">
		<br>
          <input type="submit" value="Inscription" style="height:35px; background-color:#29088A; color:white"  ></a>
        </p>
		<font size="5">
		<p align="center">
              <label>Valeur Commission</label> : 
              <input type="text" name="commission" id="vcommission" value="" /> 
		</p>
		</font>
      </div>
    <script type="text/javascript">
    
    //Declaration des variables communes
    var prixfinal = document.getElementById('prixfinal');
    var prix = document.getElementById('prix');
    
    /**
    * Fonction principale de calcul du prix
    * la fonction est appellée à chaque changement
    */
    function calculPrix(){
      CalculPrixAge();
      calculCodeAgent();
      prixCodeVoyage();
    }
    
    
      /**
      * Affiche la zone réduction en fonction de l'age selectionné
      */
      function verifAge(age){
        var reduc = document.getElementById('reduc');
        reduc.style.display =  age == '-12' ? 'inline' : 'none';   
        CalculPrixAge();
      }
      
      /**
      * Fait le calcul du prix en fonction de l'age cochée
      */
      function CalculPrixAge(){
        var prixval = prix.value;
        var agem12 = document.getElementById('agem12');
        var agep12 = document.getElementById('agep12');
        
        var age = agem12.checked ? '-12' : (agep12.checked ? '+12' : '');
        if(age == '-12'){
           console.log('ancien prix : ' + prixval);
           var prixreduc = parseFloat(prixval) * 0.5;
           console.log('Nouveau prix : ' + prixreduc);
           prixfinal.value = prixreduc;
		   
        }else if(age == '+12'){
           prixfinal.value = prixval;
        }else{
           //si aucune case n'est cochée...
           prixfinal.value = prixval;
		   
        }
      }
	  
    /**
    * Calcul en fonction du codeAgent
    */
    function calculCodeAgent(){
      var code = document.getElementById('code');
      var vcommission = document.getElementById('vcommission');

      var codeval = code.value;
      switch(codeval){
        case "JT": // si JT
          vcommission.value = prixfinal.value * 0.10;
          break;
        case "LB":  //si LB
          vcommission.value = prixfinal.value * 0.08;
        break;
        case "MM":  //si MM
          vcommission.value = prixfinal.value * 0.08;
        break;
        case "RA":  //si RA
          vcommission.value = prixfinal.value * 0.10;
          break;
        default: // Si aucun des deux
          vcommission.value = 0;
          break;
      }
    }

    /**
    * Calcul en fonction du code voyage
    */
    function prixCodeVoyage(){
      var voyage = document.getElementById('voyage');
      var voyageval = voyage.value;
      switch(voyageval){
        case "AFR01": 
          prix.value = 2340;
          break;
        case "ECO01":  
          prix.value = 550;
        break;
        
        default: // Si aucun des deux
          prix.value = 0;
          break;
      }
    }
    </script>

sarah21091999 Auteur
ca ne fonctionne pas non plus ...
0
sarah21091999 Auteur
ouhla .... ca me donne tout ca ...

Unchecked lastError value: Error: Could not establish connection. Receiving end does not exist. mcafee_wa_bkground.js:103
Un formulaire a été soumis avec l’encodage de caractères « windows-1252 » qui ne peut pas encoder tous les caractères Unicode, la saisie de l’utilisateur pourrait donc être corrompue. Pour éviter ce problème, la page pourrait être modifiée pour que le formulaire soit soumis avec l’encodage UTF-8, soit en changeant l’encodage de la page elle-même en UTF-8 soit en spécifiant « accept-charset=utf-8 » dans l’élément formulaire. connexion3.html
La page a été rechargée car la déclaration d’encodage de caractères du document HTML du cadre n’a pas été trouvée lors de l’analyse des 1024 premiers octets du fichier. La déclaration d’encodage de caractères doit être déplacée dans les 1024 premiers octets du fichier. connexionbd.php:38
Unchecked lastError value: Error: Could not establish connection. Receiving end does not exist. mcafee_wa_bkground.js:103
TypeError: prix is not a function connexionbd.php:1:1
Unchecked lastError value: Error: Could not establish connection. Receiving end does not exist. mcafee_wa_bkground.js:103
Removed unsafe attribute. Element: svg. Attribute: xlink. react-dom.js:11623:4
Removed unsafe attribute. Element: svg. Attribute: xmlns. react-dom.js:11623:4
Removed unsafe attribute. Element: svg. Attribute: xlink. react-dom.js:11623:4
Removed unsafe attribute. Element: svg. Attribute: xmlns. react-dom.js:11623:4
Removed unsafe attribute. Element: svg. Attribute: xlink. react-dom.js:11623:4
Removed unsafe attribute. Element: svg. Attribute: xmlns. react-dom.js:11623:4
Unchecked lastError value: Error: Could not establish connection. Receiving end does not exist. mcafee_wa_bkground.js:103

c'est trop complique pour moi lol
0
jordane45 Modérateur
Commence par corriger l'encodage de ton fichier
https://www.alsacreations.com/astuce/lire/69-declarer-encodage-des-caracteres.html

Et par contre... le code que je t'ai donné fonctionne parfaitement....
As tu vidé le cache de ton navigateur ?
0

sarah21091999 Auteur

c'est quoi le cache du navigateur ?

j'ai fait ca :

<!DOCTYPE html>
<html>
 <head>
  <meta charset="utf-8" />
  <title>FORMULAIRE</title>
  <style>
   h1{text-align:center;}
  </style>
 </head>
   <body text="#29088A">
     <form method="post" action="inscriptionvalidee.php">
      <div style="text-align:center">
        <p>
          <img src="nevers.png" alt="photo nevers" width="500" height="650" hspace="16" align="left"> 
        </p>
		<font size="6">
        <U><h1>FORMULAIRE</h1></U>
		</font>
		<font size="5">
		<p align="center">
              <label>Code Agent</label> : 
              <input type="text" name="agent" onkeyup="calcul(this)" id="code" value="" /> 
		</p>
        <p align="center">
            <label>Nom Client</label> : 
            <input type="text"  name="nom" value="" require/>
            <p align="center">
              <label>Prénom Client</label> : 
              <input type="text" name="prenom" value="" /> 
            </p>
            <p align="center">
              <label>Age Client</label> : 
              <input type=radio name="age12" id='agem12' onclick="verifAge(this.value);" value='-12'> -12 ans 
              <input type=radio name="age12" id='agep12' onclick="verifAge(this.value);" value='+12'> +12 ans 
            </p>
          </font>
        </p>
		<font size="5">
		<p align="center">
              <label>Code Voyage</label> : 
              <input type="text" name="voy" onkeyup="prix(this);" id="voyage" value="" /> 
		</p>
        <br>
        <span style="text-align:center" id="zone_prix" >
		<font size ="5">
          <label>Prix</label> : 
          <input type="text" name="prix" onkeyup="verifPrix(this);" id="prix" value='' > € <span style='background-color:#ffff66;' id='reduc' style='display:none' >-50%</span>
		  </br>
		  <br>
          <label>Prix Final </label> 
          <input type="text" name="prixfinal" readonly id="prixfinal" value='' /> €
        </span>
		</font>
		</br>
        
       </form>
        <p align="center">
		<br>
          <input type="submit" value="Inscription" style="height:35px; background-color:#29088A; color:white"  ></a>
        </p>
		<font size="5">
		<p align="center">
              <label>Valeur Commission</label> : 
              <input type="text" name="commission" id="vcommission" value="" /> 
		</p>
		</font>
      </div>
    <script type="text/javascript">
      /**
      // Affiche la zone réduc en fonction de l'age selectionné
      */
      function verifAge(age){
        var reduc = document.getElementById('reduc');
        var prix = document.getElementById('prix');
        reduc.style.display =  age == '-12' ? 'inline' : 'none';   
        verifPrix(prix);
      }
      
      /*
      // Fait le calcul du prix en fonction de l'age coché
      */
      function verifPrix(elm){
        var prix = elm;
        var prixval = elm.value;
        var agem12 = document.getElementById('agem12');
        var agep12 = document.getElementById('agep12');
        var prixfinal = document.getElementById('prixfinal');
        var age = agem12.checked ? '-12' : (agep12.checked ? '+12' : '');
        if(age == '-12'){
           console.log('ancien prix : ' + prixval);
           var prixreduc = parseFloat(prixval) * 0.5;
           console.log('Nouveau prix : ' + prixreduc);
           prixfinal.value = prixreduc;
		   
        }else if(age == '+12'){
           prixfinal.value = prixval;
        }else{
           //si aucune case n'est cochée...
           prixfinal.value = prixval;
		   
        }
      }
	  function calcul(){
  var code = document.getElementById('code');
  var prixfinal = document.getElementById('prixfinal');
  var vcommission = document.getElementById('vcommission');

  var codeval = code.value;
  switch(codeval){
    case "JT": // si JT
      vcommission.value = prixfinal.value * 0.10;
      break;
    case "LB":  //si LB
      vcommission.value = prixfinal.value * 0.08;
	  break;
    case "MM":  //si MM
      vcommission.value = prixfinal.value * 0.08;
	  break;
    case "RA":  //si RA
      vcommission.value = prixfinal.value * 0.10;
      break;
    default: // Si aucun des deux
      vcommission.value = 0;
      break;
  }
}

  /**
    * Calcul en fonction du code voyage
    */
    function prixCodeVoyage(){
      var voyage = document.getElementById('voyage');
      var voyageval = voyage.value;
      switch(voyageval){
        case "AFR01": 
          prix.value = 2340;
          break;
        case "ECO01":  
          prix.value = 550;
        break;
        
        default: // Si aucun des deux
          prix.value = 0;
          break;
      }
    }
    </script>
  </body> 
</html>

c'est bien ca ?

sarah21091999 Auteur
elle est en utf-8 ce n'est pas bon ?
0

Codage juste ?

2 réponses

Discussions similaires

Newsletters